jQuery Ajax instances ($.ajax, $.post, $.get)-JS Tutorial-php.cn

jQuery Ajax instances ($.ajax, $.post, $.get)

巴扎黑

Release： 2017-06-30 14:15:44

Original

1133 people have browsed it

Jquery is very good at encapsulating asynchronous submission. It is very troublesome to use AJAX directly. Jquery greatly simplifies our operations and does not need to consider the surprise of the browser.

Recommend a good jQuery Ajax example article. If you forget, you can check it out.

$.post and $.get are simple methods. If you want to deal with complex logic, you can still You need to use jQuery.ajax()

1. The general format of $.ajax

$.ajax({

type: 'POST',

url: url ,

data: data ,

success: success ,

dataType: dataType

});

2. $.ajax Parameter Description

Parameter Description

url	Required. Specifies the URL to which the request should be sent.
data	Optional. Map or string value. Specifies the data to be sent to the server with the request.
success(data, textStatus, jqXHR)	Optional. Callback function executed when the request is successful.
dataType	Optional. Specifies the data type of the expected server response. Intelligent judgment (xml, json, script or html) is performed by default.

3. Some things to note about $.ajax:

1.data There are three main methods, html splicing, jsonarray, form serialized by serialize(); specified by dataType, no intelligent judgment is specified.

2.$.ajax only submits the form in text mode. If the asynchronous submission contains Upload cannot be passed, you need to use $.ajaxSubmit of jquery.form.js

##4. My practical application example of $.ajax

 1 //1.$.ajax带json数据的异步请求 2 var aj = $.ajax( {  
 3     url:'productManager_reverseUpdate',// 跳转到 action   4     data:{  
 5              selRollBack : selRollBack,  
 6              selOperatorsCode : selOperatorsCode,  
 7              PROVINCECODE : PROVINCECODE,  
 8              pass2 : pass2  
 9     },  
10     type:'post',  
11     cache:false,  
12     dataType:'json',  
13     success:function(data) {  
14         if(data.msg =="true" ){  
15             // view("修改成功！");  16             alert("修改成功！");  
17             window.location.reload();  
18         }else{  
19             view(data.msg);  
20         }  
21      },  
22      error : function() {  
23           // view("异常！");  24           alert("异常！");  
25      }  
26 });27 28 29 //2.$.ajax序列化表格内容为字符串的异步请求30 function noTips(){  
31     var formParam = $("#form1").serialize();//序列化表格内容为字符串  32     $.ajax({  
33         type:'post',      
34         url:'Notice_noTipsNotice',  
35         data:formParam,  
36         cache:false,  
37         dataType:'json',  
38         success:function(data){  
39         }  
40     });  
41 }  
42 43 44 //3.$.ajax拼接url的异步请求45 var yz=$.ajax({  
46      type:'post',  
47      url:'validatePwd2_checkPwd2?password2='+password2,  
48      data:{},  
49      cache:false,  
50      dataType:'json',  
51      success:function(data){  
52           if( data.msg =="false" ) //服务器返回false，就将validatePassword2的值改为pwd2Error，这是异步，需要考虑返回时间  53           {  
54                textPassword2.html("<font color=&#39;red&#39;>业务密码不正确！</font>");  
55                $("#validatePassword2").val("pwd2Error");  
56                checkPassword2 = false;  
57                return;  
58            }  
59       },  
60       error:function(){}  
61 }); 
62 63 64 //4.$.ajax拼接data的异步请求65 $.ajax({   
66     url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',   
67     type:'post',   
68     data:'merName='+values,   
69     async : false, //默认为true 异步   70     error:function(){   
71        alert('error');   
72     },   
73     success:function(data){   
74        $("#"+ps).html(data);   
75     }76 });

Copy after login

The above is the detailed content of jQuery Ajax instances ($.ajax, $.post, $.get). For more information, please follow other related articles on the PHP Chinese website!