jQuery直接調用asp.net后台WebMethod方法

利用JQuery的$.ajax()可以很方便的調用asp.net的后台方法。
[WebMethod]   命名空間

 

1、無參數的方法調用, 注意：1.方法一定要靜態方法，而且要有[WebMethod]的聲明

 

后台<C#>:

using System.Web.Script.Services;

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

 

前台<JQuery>:

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

　　//禁用按鈕的提交
　　return false;
　　});
});

 

2、帶參數的方法調用

后台<C#>:

using System.Web.Script.Services;

[WebMethod]
public static string GetStr(string str, string str2)
{
　　return str + str2;
}

前台<JQuery>:

$(function() {
　　$("#btnOK").click(function() {
　　　　$.ajax({
　　　　　　type: "Post",
　　　　　　url: "data.aspx/GetStr",
　　　　　　//方法傳參的寫法一定要對，str為形參的名字,str2為第二個形參的名字
　　　　　　data: "{'str':'我是','str2':'XXX'}",
　　　　　　contentType: "application/json; charset=utf-8",
　　　　　　dataType: "json",
　　　　　　success: function(data) {
　　　　　　//返回的數據用data.d獲取內容
　　　　　　alert(data.d);
　　　　　　},
　　　　error: function(err) {
　　　　　　alert(err);
　　　　}
　　});

　　//禁用按鈕的提交
　　return false;
　　});
});

 

3、返回數組方法的調用

后台<C#>:

using System.Web.Script.Services;

[WebMethod]
public static List<string> GetArray()
{
　　List<string> li = new List<string>();

　　for (int i = 0; i < 10; i++){
　　　　li.Add(i + "");
　　}
　　return li;
}

前台<JQuery>:

$(function() {
　　$("#btnOK").click(function() {
　　　　$.ajax({
　　　　　　type: "Post",
　　　　　　url: "data.aspx/GetArray",
　　　　　　contentType: "application/json; charset=utf-8",
　　　　　　dataType: "json",
　　　　　　success: function(data) {
　　　　　　//插入前先清空ul
　　　　　　$("#list").html("");

　　　　　　//遞歸獲取數據
　　　　　　$(data.d).each(function() {
　　　　　　//插入結果到li里面
　　　　　　　　$("#list").append("<li>" + this + "</li>");
　　　　　　});

　　　　　　　　alert(data.d);
　　　　},
　　　　error: function(err) {
　　　　　　　　alert(err);
　　　　　　}
　　　　});

　　　　//禁用按鈕的提交
　　　　return false;
　　});
});
/// <reference path="jquery-1.4.2-vsdoc.js"/>
$(function() {
　　$("#btnOK").click(function() {
　　　　$.ajax({
　　　　　　type: "Post",
　　　　　　url: "data.aspx/GetArray",
　　　　　　contentType: "application/json; charset=utf-8",
　　　　　　dataType: "json",
　　　　　　success: function(data) {
　　　　　　//插入前先清空ul
　　　　　　$("#list").html("");

　　　　　　//遞歸獲取數據
　　　　　　$(data.d).each(function() {
　　　　　　//插入結果到li里面
　　　　　　$("#list").append("<li>" + this + "</li>");
　　　　});

　　　　　　alert(data.d);
　　　　},
　　　　error: function(err) {
　　　　　　alert(err);
　　　　}
　　});

　　　　//禁用按鈕的提交
　　　　return false;
　　});
});