萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> jquery.Ajax()方法調用Asp.Net後台的方法解析

jquery.Ajax()方法調用Asp.Net後台的方法解析

 本篇文章主要是對jquery.Ajax()方法調用Asp.Net後台的方法進行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助

利用JQuery的$.ajax()可以很方便的調用asp.net的後台方法。 先來個簡單的實例熱熱身吧。   1、無參數的方法調用 asp.net code:    代碼如下: using System.Web.Script.Services;      [WebMethod]    public static string SayHello()    {         return "Hello Ajax!";    }   using System.Web.Script.Services;   [WebMethod] public static string SayHello() {      return "Hello Ajax!"; }      注意:1.方法一定要靜態方法,而且要有[WebMethod]的聲明   JQuery code:    代碼如下: /// <reference path="jquery-1.4.2-vsdoc.js"/>    $(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;        });    });   /// <reference path="jquery-1.4.2-vsdoc.js"/> $(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、帶參數的方法調用 asp.net code:     代碼如下: using System.Web.Script.Services;      [WebMethod]    public static string GetStr(string str, string str2)    {        return str + str2;    }   using System.Web.Script.Services;   [WebMethod] public static string GetStr(string str, string str2) {     return str + str2; }      JQuery code:  代碼如下: /// <reference path="jquery-1.4.2-vsdoc.js"/>    $(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;        });    });   /// <reference path="jquery-1.4.2-vsdoc.js"/> $(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、返回數組方法的調用 asp.net code:    代碼如下: 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;    }   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 code:  代碼如下: /// <reference path="jquery-1.4.2-vsdoc.js"/>    $(function() {        $("#btnOK").click(function() {
copyright © 萬盛學電腦網 all rights reserved