Asp.net中JQuery、ajax调用后台方法总结

整个过程当中学习到很多知识点，了解了jquery、ajax在asp.net中的运用，加以总结，其实原理都是一样的，理解了一种，其他的注意很少的区别就可以了、灵活运用：

1、有参数的方法调用

示例代码如下：
前台jQuery代码：
$(function() { 

 知道的一种就是ajax调后台的方法。 

1、有参数的方法调用  

示例代码如下： 

前台jQuery代码：

$(function() {  
  var browers = browersEstimate();  
  var params = '{browersType:"' + browers + '"}';  
  $.ajax({  
      type: "POST",                   //提交方式  
      url: "Default.aspx/RecordData",   //提交的页面/方法名  
      data: params,                   //参数（如果没有参数：null）  
      dataType: "json",                   //类型  
      contentType: "application/json; charset=utf-8",       
      success: function(data) {       
              //返回的数据用data.d获取内容       
                alert(data.d);       
          },       
          error: function(err) {       
              alert(err);       
         });     
     });

这个是jquery下Ajax方法调用后台方法。

这个方法有几点需要说明： 

type方式必须是post，再有就是后台的方法必须是静态的，方法声明要加上特性[System.Web.Services.WebMethod()]，传递的参数个数也应该和方法的参数相同。

asp.Net后台方法：

随缘网络php企业网站管理系统2.0

随缘网络PHP企业网站管理系统V2.0正式发布，该企业网站管理系统采用PHP+MYSQL编写，界面色调风格延续之前1.0版管理系统简洁浅蓝色风格，稍有所变动。变更分类树形目录方式采用jquery库，产品，文章三级无限分类。希望大家能够喜欢。系统中难免有些小问题，希望大家在使用中有什么问题可到本站论坛提出，我们将总结各问题后给予修正并升级。本站再次声明对于免费版系列系统本站不提供QQ电话等技术咨询服

下载

  [System.Web.Services.WebMethod()]  
    public static void RecordData(string browersType)  
    {  
        if (BrowserControl.Counters == null)  
        {  
            BrowserControl.InitData(0);  
        }  
  
        if (browersType == "")  
        {  
            browersType = "Other";  
        }  
  
        BrowserControl.AddOneByBrowserType(browersType);  
        if (BrowserControl.WriteInDataBase())  
        {  
            BrowserControl.OldTotalCount = BrowserControl.Counters.Count;  
        }  
        else  
        {  
            BrowserControl.OldTotalCount = 0;  
        }  
    }

2、无参数的方法调用

示例代码：

前台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;       
    });       
});

asp.net后台方法

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

3、返回数组方法的调用

示例前台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("" + this + "");       
                });       
                alert(data.d);       
            },       
            error: function(err) {       
                alert(err);       
            }       
        });       
        //禁用按钮的提交       
        return false;       
    });       
});

asp.net 后台代码：asp.net 后台代码：

[System.Web.Services.WebMethod()]     
public static List GetArray()       
{       
  List li = new List();       
for (int i = 0; i < 10; i++)       
        li.Add(i + "");       
return li;       
} 

4、操作xml

xnl文件示例：     
       
      
        
    1      
    qwe      
        
        
    2      
    asd      
        
       
Jquery代码：Jquery代码：

Jquery前台代码：

$(function() {       
    $("#btnOK").click(function() {       
        $.ajax({       
            url: "XMLtest.xml",       
            dataType: 'xml', //返回的类型为XML ，和前面的Json，不一样了       
            success: function(xml) {       
                //清空list       
                $("#list").html("");       
                //查找xml元素       
                $(xml).find("data>item").each(function() {      
  
                    $("#list").append("id:" + $(this).find("id").text() +"");      
  
                    $("#list").append("Name:"+ $(this).find("name").text() + "");       
                })       
            },       
            error: function(result, status) { //如果没有上面的捕获出错会执行这里的回调函数       
                alert(status);       
            }       
        });       
        //禁用按钮的提交       
        return false;       
    });       
});

总结

主要是我们要注意js代码里面的方法名要与后台一致，再有就是后台的方法必须是静态的，方法声明要加上特性[System.Web.Services.WebMethod()]，传递的参数个数也应该和方法的参数相同，注意这几部分我们的调试就简单多了，剩下的就是多多实践、加强原理的理解了。

更多Asp.net中JQuery、ajax调用后台方法总结相关文章请关注PHP中文网！