1. 程式人生 > >asp.net利用Ajax和Jquery在前臺向後臺傳參數並返回值

asp.net利用Ajax和Jquery在前臺向後臺傳參數並返回值

否則 cli for res 反序 tty 服務器 .ajax content

asp.net利用Ajax和Jquery在前臺向後臺傳參數並返回值,通過aspx.cs中的靜態方法WebMethod進行處理

後臺代碼:

using System.Web.Services; //引入命名空間


[WebMethod]
public static string SayHello()
{
return "Hello Ajax!";
}

前臺頁面代碼:

<form id="form1" runat="server">
<div>
    <asp:Button ID="btn" runat="server" Text="驗證用戶" />
</div>
</form>

Javascript代碼:

$(function() {
$("#btn").click(function() {
$.ajax({
type: "post", //要用post方式
url: "Demo.aspx/SayHello",//方法所在頁面和方法名
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert(data.d);//返回的數據用data.d獲取內容
},
error: function(err) {
alert(err);
}
});
});
});

//標準的寫法:
$.ajax({
type: "post",
dataType: "json",
contentType: "application/json", //註意:WebMethod()必須加這項,否則客戶端數據不會傳到服務端
data:{如上所述},//註意:data參數可以是string個int類型
url: "List.aspx/DeleteNews",//模擬web服務,提交到方法
// 可選的 async:false,阻塞的異步就是同步
beforeSend:function(){
// do something.
// 一般是禁用按鈕等防止用戶重復提交
$("#btnClick").attr({disabled:"disabled"});
// 或者是顯示loading圖片
},
success: function (data) {
alert("success: " + data.d);//註意這裏:必須通過data.d才能獲取到服務器返回的值
// 服務端可以直接返回Model,也可以返回序列化之後的字符串,如果需要反序列化:string json = JSON.parse(data.d);
// 有時候需要嵌套調用ajax請求,也是可以的
},
complete: function(){
//do something.
$("#btnClick").removeAttr("disabled");
// 隱藏loading圖片
},
error: function (data) {
alert("error: " + data.d);
}
});

asp.net利用Ajax和Jquery在前臺向後臺傳參數並返回值