您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

jquery.Ajax()方法调用Asp.Net后台的方法解析

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 本篇文章主要是对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() {