Asp.net에서 JQuery 및 ajax가 호출하는 백그라운드 메서드 요약

전체 과정에서 많은 지식 포인트를 얻었고, asp.NET에서 jQuery와 Ajax를 사용하는 방법에 대해 배웠습니다. 사실 원리는 동일합니다. , 유연한 사용:

1. 매개변수를 사용한 메서드 호출

샘플 코드는 다음과 같습니다.
프런트엔드 jQuery 코드:
$ (function() { 

제가 아는 방법 중 하나는 배경을 조정하는 ajax입니다.

1. 매개변수를 사용한 메소드 호출

샘플 코드는 다음과 같습니다. 다음은 다음과 같습니다.

프런트 엔드 jQuery 코드:

<span style="font-size:18px">$(function() {  
  var browers = browersEstimate();  
  var params = &#39;{browersType:"&#39; + browers + &#39;"}&#39;;  
  $.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);       
         });     
     });</span>

이것은 백그라운드 메서드를 호출하는 jquery의 Ajax 메서드입니다.

이에 대해 몇 가지 참고할 사항이 있습니다. 메소드:

타입 메소드는 post여야 하고, 백그라운드 메소드는 static이어야 합니다. 메소드 선언은 [System.Web.Services.WebMethod()] 속성과 함께 추가되어야 합니다. 전달된 매개변수는 메서드의 매개변수와 동일해야 합니다.

asp.Net 백그라운드 메서드:

<span style="font-size:18px">  [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;  
        }  
    }</span>

2. 매개변수 없는 메서드 호출

샘플 코드:

프런트엔드 jQuery 코드

<span style="font-size:18px">$(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;       
    });       
});</span>

asp.net 백그라운드 메서드

<span style="font-size:18px">[System.Web.Services.WebMethod()]  
public static string SayHello()       
{       
return "Hello Ajax!";       
}</span>

3. 반환 배열 메서드 호출

프런트 예시- 최종 JQuery 코드:

<span style="font-size:18px">$(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;       
    });       
});</span>

asp.net 백엔드 코드: asp.net 백엔드 코드:

<span style="font-size:18px">[System.Web.Services.WebMethod()]     
public static List GetArray()       
{       
  List li = new List();       
for (int i = 0; i < 10; i++)       
        li.Add(i + "");       
return li;       
} </span>

4. 작업 xml

<span style="font-size:18px">xnl文件示例：     
 <?xml version="1.0" encoding="utf-8" ?>      
<data>      
  <item>      
    <id>1</id>      
    <name>qwe</name>      
  </item>      
  <item>      
    <id>2</id>      
    <name>asd</name>      
  </item>      
</data>       
Jquery代码：Jquery代码：</span>

Jquery 프론트엔드 코드:

<span style="font-size:18px">$(function() {       
    $("#btnOK").click(function() {       
        $.ajax({       
            url: "XMLtest.xml",       
            dataType: &#39;xml&#39;, //返回的类型为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;       
    });       
});</span>

요약

가장 중요한 점은 백엔드 및 배경과 일관성을 유지하기 위해 js 코드의 메소드 이름에 주의해야 한다는 것입니다. 메소드는 정적이어야 합니다. 메소드 선언은 [System.Web.Services.WebMethod()] 속성으로 추가되어야 합니다. 전달된 매개변수의 수도 동일해야 합니다. 디버깅이 훨씬 간단합니다. 나머지는 더 많이 연습하고 원리에 대한 이해를 강화하는 것입니다.

Asp에서 JQuery 및 Ajax 호출 백그라운드 메서드를 요약하는 관련 기사를 더 살펴보시기 바랍니다. .net.PHP 중국어 웹사이트