Zusammenfassung der Hintergrundmethoden, die von JQuery und Ajax in Asp.net aufgerufen werden

高洛峰
Freigeben: 2016-12-16 16:17:35
Original
1285 Leute haben es durchsucht

Ich habe während des gesamten Prozesses viele Wissenspunkte gelernt und etwas über die Verwendung von jQuery und Ajax in asp.NET gelernt. Zusammenfassend lässt sich sagen, dass die Prinzipien dieselben sind. Wenn Sie eines verstehen, können Sie darauf achten zu den anderen mit wenigen Unterschieden. , Flexible Verwendung:

1. Methodenaufruf mit Parametern

Der Beispielcode lautet wie folgt:
Front-End-jQuery-Code:
$ (function() { 

Eine Methode, die ich kenne, ist Ajax, um den Hintergrund anzupassen.

1. Methodenaufruf mit Parametern

Der Beispielcode ist wie folgt folgt:

Front-End-jQuery-Code:

<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>
Nach dem Login kopieren

Dies ist die Ajax-Methode unter jquery, die die Hintergrundmethode aufruft.

Dazu sind mehrere Punkte zu beachten Methode:

Die Typmethode muss post sein und die Hintergrundmethode muss statisch sein. Die Methodendeklaration sollte mit dem Attribut [System.Web.Services.WebMethod()] und der Nummer hinzugefügt werden Die Anzahl der übergebenen Parameter sollte mit den Parametern der Methode übereinstimmen:

2. Beispielcode:
<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>
Nach dem Login kopieren

Front-End-jQuery-Code

asp.net-Hintergrundmethode

<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>
Nach dem Login kopieren
3. Beispiel für die Rückgabe-Array-Methode

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

asp.net-Back-End-Code: asp.net-Back-End-Code:

<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>
Nach dem Login kopieren
4. Operation xml

<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>
Nach dem Login kopieren
Jquery-Frontend-Code:

<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>
Nach dem Login kopieren
Zusammenfassung

Die Hauptsache ist, dass wir darauf achten sollten, dass der Methodenname im JS-Code mit dem Backend und dem Hintergrund übereinstimmt Die Methodendeklaration muss mit dem Attribut [System.Web.Services.WebMethod()] hinzugefügt werden. Die Anzahl der übergebenen Parameter sollte mit den Parametern unserer Methode übereinstimmen Debuggen. Es ist viel einfacher, der Rest besteht darin, mehr zu üben und das Verständnis der Prinzipien zu stärken
<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>
Nach dem Login kopieren

Bitte beachten Sie weitere verwandte Artikel, die die Hintergrundmethoden für JQuery- und Ajax-Aufrufe in Asp zusammenfassen .net. PHP Chinesische Website

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!