Several common ajax functions in jqury, jquryajax Functions
I:
AJAX is a technology that updates some webpages without the need to reload the entire webpage.
What Is AJAX?
AJAX = Asynchronous JavaScript and XML.
AJAX is a technology used to create fast dynamic web pages.
By performing a small amount of data exchange with the server in the background, AJAX can implement asynchronous updates on webpages. This means that you can update a part of a webpage without reloading the entire webpage.
If you need to update the content of a traditional web page (without AJAX), you must reload the entire web page.
There are many AJAX application cases: Sina Weibo, Google Maps, kaixin.com, and so on.
Ii. Traditional Ajax is too cumbersome. jquer encapsulates some simple functions commonly used by ajax.
A: $. ajax () method:
Jsp page code:
<Head> <title> Ajax verification </title> <script type = "text/javascript" src = "js/jquery-1.8.3.min.js"> </script> <script type = "text/ javascript "> $ (function () {$ ("[name = 'username']"). blur (function () {$. ajax ({type: "post", url: "/TestServlet", data: {action: "login"}, // The parameters passed by data are generally key: the value of the "value" type must be enclosed in quotation marks. I personally experience the feeling that the error cannot be found. // dataType: 'text', // The format returned by servers can also be gjon success: function (data) {if (data = "success") {alert (data); $ ("# myspan" ).html (data) ;}}, error: function () {// This is rarely used}) </script>
Servlet background code:
Public class TestServlet extends HttpServlet {protected void doPost (HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {String name = request. getParameter ("action"); System. out. println (name); if (name. equals ("login") {response. getWriter (). write ("success"); // return the function parameter} else {response. getWriter (). write ("file ");}}
B: $. get (), $. post (), and $. getJson are both lite versions of the $. ajax () method. The usage is roughly the same, with a type missing
$.post("/TestServlet", {"uname":$('[name=uname]').val()}, function (data) { alert(data); });
C: $. load ()
$ ("# Msg "). load (// you can directly get the value of the text box "/TestServlet", "action =" + $ ('[name = "userName"]'). val ());
// The backend can directly obtain the parameter value based on request. getParameter ().
D: $ (Selector). SerializeArray () and $ (Selector). Serialize ()
// This method can directly obtain the name attribute value of the form as the data Parameter
Var data1 = $ ("# form1 "). serializeArray (); // automatically encapsulate the form into json $. each (data1, function (I, dom) {alert (dom. name + "\ r \ n" + dom. value) ;}); var data2 =$ ("# form1 "). serialize (); alert (data2 );
E: as the data Parameter
var data2=$("#form1").serialize(); $.getJSON("/TestServlet",data2, function (data) { alert(data); });