快捷導(dǎo)航

jQuery Ajax使用實例

更新時間：2015年04月16日 08:49:38 投稿：junjie

這篇文章主要介紹了jQuery Ajax使用實例,本文講解了$.ajax的一般格式、$.ajax的參數(shù)描述、$.ajax需要注意的一些地方、$.ajax我的實際應(yīng)用例子,需要的朋友可以參考下

Jquery在異步提交方面封裝的很好，直接用AJAX非常麻煩，Jquery大大簡化了我們的操作，不用考慮瀏覽器的差異了。

$.post、$.get是一些簡單的方法，如果要處理復(fù)雜的邏輯，還是需要用到j(luò)Query.ajax()
一、$.ajax的一般格式

$.ajax({
   type: 'POST',
   url: url ,
  data: data ,
  success: success ,
  dataType: dataType
});

二、$.ajax的參數(shù)描述

參數(shù) 描述
url 必需。規(guī)定把請求發(fā)送到哪個 URL。
data 可選。映射或字符串值。規(guī)定連同請求發(fā)送到服務(wù)器的數(shù)據(jù)。
success(data, textStatus, jqXHR) 可選。請求成功時執(zhí)行的回調(diào)函數(shù)。
dataType 可選。規(guī)定預(yù)期的服務(wù)器響應(yīng)的數(shù)據(jù)類型。
默認執(zhí)行智能判斷（xml、json、script 或 html）。
三、$.ajax需要注意的一些地方：

1.data主要方式有三種，html拼接的，json數(shù)組，form表單經(jīng)serialize()序列化的；通過dataType指定，不指定智能判斷。

2.$.ajax只提交form以文本方式，如果異步提交包含<file>上傳是傳過不過去,需要使用jquery.form.js的$.ajaxSubmit

四、$.ajax我的實際應(yīng)用例子

//1.$.ajax帶json數(shù)據(jù)的異步請求 
var aj = $.ajax( {  
  url:'productManager_reverseUpdate',// 跳轉(zhuǎn)到 action  
  data:{  
       selRollBack : selRollBack,  
       selOperatorsCode : selOperatorsCode,  
       PROVINCECODE : PROVINCECODE,  
       pass2 : pass2  
  },  
  type:'post',  
  cache:false,  
  dataType:'json',  
  success:function(data) {  
    if(data.msg =="true" ){  
      // view("修改成功！");  
      alert("修改成功！");  
      window.location.reload();  
    }else{  
      view(data.msg);  
    }  
   },  
   error : function() {  
     // view("異常！");  
     alert("異常！");  
   }  
}); 
 
 
//2.$.ajax序列化表格內(nèi)容為字符串的異步請求 
function noTips(){  
  var formParam = $("#form1").serialize();//序列化表格內(nèi)容為字符串  
  $.ajax({  
    type:'post',    
    url:'Notice_noTipsNotice',  
    data:formParam,  
    cache:false,  
    dataType:'json',  
    success:function(data){  
    }  
  });  
}  
 
 
//3.$.ajax拼接url的異步請求 
var yz=$.ajax({  
   type:'post',  
   url:'validatePwd2_checkPwd2?password2='+password2,  
   data:{},  
   cache:false,  
   dataType:'json',  
   success:function(data){  
     if( data.msg =="false" ) //服務(wù)器返回false，就將validatePassword2的值改為pwd2Error，這是異步，需要考慮返回時間  
     {  
        textPassword2.html("<font color='red'>業(yè)務(wù)密碼不正確！</font>");  
        $("#validatePassword2").val("pwd2Error");  
        checkPassword2 = false;  
        return;  
      }  
   },  
   error:function(){}  
});  
 
 
//4.$.ajax拼接data的異步請求 
$.ajax({   
  url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',   
  type:'post',   
  data:'merName='+values,   
  async : false, //默認為true 異步   
  error:function(){   
    alert('error');   
  },   
  success:function(data){   
    $("#"+divs).html(data);   
  } 
});

您可能感興趣的文章: