异步请求
$.ajax({
url:
'UserAdd.action'
,
data:user,
type:
'post'
,
dataType:
'text'
,
} url那里写上地址
跨域请求:
$.ajax({ 2 type:"get", //请求方式 3 async:true, //是否异步 4 url:"http://www.domain.net/url", 5 dataType:"jsonp", //跨域json请求一定是jsonp 6 jsonp: "callbackparam", //跨域请求的参数名,默认是callback 7 //jsonpCallback:"successCallback", //自定义跨域参数值,回调函数名也是一样,默认为jQuery自动生成的字符串 8 data:{"query":"civilnews"}, //请求参数 9 10 beforeSend: function() { 11 //请求前的处理 12 }, 13 14 success: function(data) { 15 //请求成功处理,和本地回调完全一样 16 }, 17 18 complete: function() { 19 //请求完成的处理 20 }, 21 22 error: function() { 23 //请求出错处理 24 } 25 });
js 之 Post发送请求
// ajax 对象 function ajaxObject() { var xmlHttp; try { // Firefox, Opera 8.0+, Safari xmlHttp = new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { alert("您的浏览器不支持AJAX!"); return false; } } } return xmlHttp; } // ajax post请求: function ajaxPost ( url , data , fnSucceed , fnFail , fnLoading ) { var ajax = ajaxObject(); ajax.open( "post" , url , true ); ajax.setRequestHeader( "Content-Type" , "application/x-www-form-urlencoded" ); ajax.onreadystatechange = function () { if( ajax.readyState == 4 ) { if( ajax.status == 200 ) { fnSucceed( ajax.responseText ); } else { fnFail( "HTTP请求错误!错误码:"+ajax.status ); } } else { fnLoading(); } } ajax.send( data ); }
或者使用jQuery的$.post方法可以以POST形式向服务器发起AJAX请求。$.post方法是jQuery的实用工具方法。
$.post方法语法
$.post(url,parameters,callback) |
|
参数 |
|
url |
(字符串)服务器端资源地址。 |
parameter |
(对象)需要传递到服务器端的参数。 参数形式为“键/值”。 |
callback |
(函数)在请求完成时被调用。该函数参数依次为响应体和状态。 |
返回值 |
XHR实例 |
实例:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <script type="text/javascript"> $().ready(function () { $('#selectNum').change(function () { var idValue = $(this).val(); //采用POST方式调用服务 $.post('Server.aspx', { id: idValue }, function (text, status) { alert(text); }); }) }) </script> </head> <body> <select id="selectNum"> <option value="0">--Select--</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </body> </html>