Heim > Web-Frontend > js-Tutorial > Detaillierte Erläuterung der Schritte zum Aufrufen des Hintergrunds mit jQuery+AJAX

Detaillierte Erläuterung der Schritte zum Aufrufen des Hintergrunds mit jQuery+AJAX

php中世界最好的语言
Freigeben: 2018-04-24 15:55:00
Original
3048 Leute haben es durchsucht

Dieses Mal werde ich Ihnen eine detaillierte Erklärung der Schritte für jQuery+AJAX zur Implementierung des Backend-Aufrufs geben. Was sind die Hinweise für jQuery+AJAX zur Implementierung des Backend-Aufrufs? . Das Folgende ist ein praktischer Fall.

1. Erstellen Sie eine neue demo.aspx-Seite.

2. Fügen Sie zunächst eine Referenz zur Hintergrunddatei demos.aspx.cs der Seite hinzu.

mit System.Web.Services;

1). Methodenaufruf ohne Parameter.
Bitte beachten Sie, dass diese Version nicht niedriger als .net Framework 2.0 sein darf. Es wird in Version 2.0 nicht unterstützt.
Backend-Code:

[WebMethod]   
public static string SayHello()   
{   
   return "Hello Ajax!";   
}
Nach dem Login kopieren

JS-Code:

$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      //要用post方式   
      type: "Post",   
      //方法所在页面和方法名   
      url: "Demo.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;   
  });   
});
Nach dem Login kopieren

Seitencode:

  <form id="form1" runat="server">
  <p>
    <asp:Button ID="btnOK" runat="server" Text="验证用户" />
  </p>
  </form>
Nach dem Login kopieren

Der Vorgangseffekt ist wie folgt:

2).

3).Return

array

Methode

Backend-Code:

[WebMethod]   
public static string GetStr(string str, string str2)   
{   
  return str + str2;   
}
Nach dem Login kopieren
JS-Code:
$(function() {   
  $("#btnOK").click(function() {   
    $.ajax({   
      type: "Post",   
      url: "demo.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;   
  });   
});
Nach dem Login kopieren

Seitencode:

Laufergebnisdiagramm:

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Ajax implementiert die Kommentarfunktion ohne Aktualisierung

Detaillierte Erläuterung der AJAX-Verwendung im grafischen Tutorial

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Schritte zum Aufrufen des Hintergrunds mit jQuery+AJAX. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen 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