Ajax常用请求方式

2017-12-20 08:19:22来源:CSDN作者:qq_35841807人点击

分享

常用请求方式:

1.$.ajax()返回其创建的 XMLHttpRequest 对象。$.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息。详细参数选项见下。如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml")。实例:保存数据到服务器,成功时显示信息。 $.ajax({ type: "post", dataType: "html", url: '/Resources/GetList.ashx', data: dataurl, success: function (data) { if (data != "") { $("#pager").pager({ pagenumber: pagenumber, pagecount: data.split("$$")[1], buttonClickCallback: PageClick }); $("#anhtml").html(data.split("$$")[0]); } } });2.通过远程 HTTP GET 请求载入信息。这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。实例:$.get("test.cgi", { name: "John", time: "2pm" }, function(data){ alert("Data Loaded: " + data); }); 3. 通过远程 HTTP POST 请求载入信息。这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。实例: $.post("/Resources/addfriend.ashx", { "fid": fids, "fname": fnames, "tuid": tuids, "tuname": tunames }, function (data) { if (data == "ok") { alert("添加成功!"); } })4.通过 HTTP GET 请求载入 JSON 数据。实例:$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?",function(data){ $.each(data.items, function(i,item){ $("<img/>").attr("src", item.media.m).appendTo("#images"); if ( i == 3 ) return false; });});
jQuery中ajax的4种常用请求方式:1.$.ajax()返回其创建的 XMLHttpRequest 对象。$.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息。详细参数选项见下。如果你指定了 dataType 选项,请确保服务器返回正确的 MIME 信息,(如 xml 返回 "text/xml")。实例:保存数据到服务器,成功时显示信息。  $.ajax({        type: "post",        dataType: "html",        url: '/Resources/GetList.ashx',        data: dataurl,        success: function (data) {            if (data != "") {                $("#pager").pager({ pagenumber: pagenumber, pagecount: data.split("$$")[1], buttonClickCallback: PageClick });                $("#anhtml").html(data.split("$$")[0]);            }        }   
    });2.通过远程 HTTP GET 请求载入信息。这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。实例:$.get("test.cgi", { name: "John", time: "2pm" },  function(data){    alert("Data Loaded: " + data);  }); 3. 通过远程 HTTP POST 请求载入信息。这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。实例: $.post("/Resources/addfriend.ashx", { "fid": fids, "fname": fnames, "tuid": tuids, "tuname": tunames }, function (data) {        if (data == "ok") {            alert("添加成功!");        }    })5.返回数据后(data)后直接调用函数实例:$(function() {			var url = "/shslc/khtj/tjgl/endCaseAjax.do?state=04";			$.post(url, initData, "json")			})		function initData(data) {
			
		}

data详解:

  1. data    可选。映射或字符串值。规定连同请求发送到服务器的数据。  
  2. success(data, textStatus, jqXHR)    可选。请求成功时执行的回调函数。  
  3. dataType      
  4. 可选。规定预期的服务器响应的数据类型。  
  5. 默认执行智能判断(xml、json、script 或 html)。  
  6.    
  7. 三、$.ajax需要注意的一些地方:  
  8.   1.data主要方式有三种,html拼接的,json数组,form表单经serialize()序列化的;通过dataType指定,不指定智能判断。  
  9.   2.$.ajax只提交form以文本方式,如果异步提交包含<file>上传是传过不过去,需要使用jquery.form.js的$.ajaxSubmit  
  10.   
  11. 四、$.ajax我的实际应用例子  
  12. Js代码  收藏代码  
  13. //1.$.ajax带json数据的异步请求    
  14. var aj = $.ajax( {      
  15.     url:'productManager_reverseUpdate',// 跳转到 action      
  16.     data:{      
  17.              selRollBack : selRollBack,      
  18.              selOperatorsCode : selOperatorsCode,      
  19.              PROVINCECODE : PROVINCECODE,      
  20.              pass2 : pass2      
  21.     },      
  22.     type:'post',      
  23.     cache:false,      
  24.     dataType:'json',      
  25.     success:function(data) {      
  26.         if(data.msg =="true" ){      
  27.             alert("修改成功!");      
  28.             window.location.reload();      
  29.         }else{      
  30.             view(data.msg);      
  31.         }      
  32.      },      
  33.      error : function() {           
  34.           alert("异常!");      
  35.      }      
  36. });    
  37.     
  38.     
  39. //2.$.ajax序列化表格内容为字符串的异步请求    
  40. function noTips(){      
  41.     var formParam = $("#form1").serialize();//序列化表格内容为字符串      
  42.     $.ajax({      
  43.         type:'post',          
  44.         url:'Notice_noTipsNotice',      
  45.         data:formParam,      
  46.         cache:false,      
  47.         dataType:'json',      
  48.         success:function(data){      
  49.         }      
  50.     });      
  51. }      
  52.     
  53.     
  54. //3.$.ajax拼接url的异步请求    
  55. var yz=$.ajax({      
  56.      type:'post',      
  57.      url:'validatePwd2_checkPwd2?password2='+password2,      
  58.      data:{},      
  59.      cache:false,      
  60.      dataType:'json',      
  61.      success:function(data){      
  62.           if( data.msg =="false" ) //服务器返回false,就将validatePassword2的值改为pwd2Error,这是异步,需要考虑返回时间      
  63.           {      
  64.                textPassword2.html("<font color='red'>业务密码不正确!</font>");      
  65.                $("#validatePassword2").val("pwd2Error");      
  66.                checkPassword2 = false;      
  67.                return;      
  68.            }      
  69.       },      
  70.       error:function(){}      
  71. });     
  72.     
  73.     
  74. //4.$.ajax拼接data的异步请求    
  75. $.ajax({       
  76.     url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',       
  77.     type:'post',       
  78.     data:'merName='+values,       
  79.     async : false, //默认为true 异步       
  80.     error:function(){       
  81.        alert('error');       
  82.     },       
  83.     success:function(data){       
  84.        $("#"+divs).html(data);       
  85.     }    
  86. });   
   

最新文章

123

最新摄影

闪念基因

微信扫一扫

第七城市微信公众平台