jquery.Ajax() メソッドは、Asp.Net バックグラウンドメソッド Analysis_jquery を呼び出します。-jsチュートリアル-php.cn

JQuery の $.ajax() を使用すると、asp.net のバックグラウンドメソッドを簡単に呼び出すことができます。
最初に簡単な例でウォームアップしましょう。

1. パラメーターなしのメソッド呼び出し
asp.net コード:

コードをコピーコードは次のとおりです:

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-1.4.2-vsdoc.js"/>

$(function() {
$("#btnOK").click(function() {

$. ajax({ contentType: 「application/ json」、 (data.d ); > //ボタンの送信を無効にします return false; }); }); およびメソッド名 URL: "data.aspx/SayHello", contentType: "application/json; charset=utf-8",

dataType: "json",

: function(data success ) {
alert(err);
}
});

RM
結果:

2. パラメーターを使用したメソッド呼び出し
asp.net コード:

コードをコピーコードは次のとおりです:

using System.Web.Script.Services;

[WebMethod]
public static string GetStr(string str, string str2)
{
str str2 を返します
}
System.Web.Script.Services を使用します;

[WebMethod]
public static string GetStr(string str, string str2)
{
return str str2;
}

JQuery コード:

コードをコピーコードは次のとおりです:

///
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: " post "、
url：" data.aspx/getStr "、 'str'： 'i am'、 'str2'： 'xxx'}"、
contentType： "application/json; charset = utf- 8 "、
データタイプ：" json "、
success：function（data）{
🎜> alert（err）; $(function() {
$("#btnOK").click(function() {
$.ajax( { タイプ: "投稿",
URL: "データ.aspx/GetStr",
// パラメーターを渡す方法は正しくなければなりません。STR はパラメーターの名前、STR2 は 2 番目の形状です。パラメーター名
data: "{'str':'I am' ,'str2':'XXX'}",
contentType: "application/json; charset=utf-8",
dataType : "json",
success: function(data) {
//返されるデータは data.d を使用して取得されます error: function (err) {
alter(err);
RM
実行結果:

以下に高度なアプリケーションを入力してください

3. 配列メソッドを返す呼び出し
asp.net コード:

コードをコピーコードは次のとおりです。

using System.Web.Script.Services;

[WebMethod]
public static List
{
List li = new List();

for (int i = 0; i li.Add(i ""); >
return li;
}
using System.Web.Script.Services;
[WebMethod]

public static List GetArray()
{
List li = new List();

for (int i = 0; i li.Add(i "");
return li;

}

JQuery コード:

コードをコピーコードは次のとおりです:

/// <参照パス="jquery-1.4.2-vsdoc.js"/>
$(function() {
$("#btnOK").click( function() {
$.ajax({
タイプ: "Post",
url: "data.aspx/GetArray",
contentType: "application/json; charset=utf-8" ,
dataType: "json",
success: function(data) {
//
$("#list").html(""); を挿入する前に ul をクリアします。 🎜> ("#list").append("

" this "

"); エラー: function(err) {
アラート(err); // /
$(function() {
$("#btnOK").click(function() {
$ .ajax({
タイプ: 「投稿」,

success: function(data) {

.append("< li>" this "");
});

アラート(data.d) 🎜> });

RM
実行結果:

4. Hashtable メソッドへの呼び出しを返します
asp.net コード:

コードコードは次のとおりです:

using System.Web.Script.Services;
using System.Collections;

[WebMethod]
public static Hashtable GetHash (文字列キー,文字列値)
{
Hashtable hs = new Hashtable();

hs.Add("www", "yahooooooo");
hs.Add(key,値);

return
}
using System.Web.Script.Services;
using System.Collections;

[WebMethod]
public static Hashtable GetHash(string key,string value)
{
Hashtable hs = new Hashtable();

hs.Add("www", "yahooooooo");
hs.Add(key, value);

return hs;
}

JQuery コード:

コードをコピーコードは次のとおりです:

///
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetHash",
//必ず二重引用符を追加してください T_T
data: "{ 'key': 'haha', 'value ': 'はは ' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
"key: haha ==> " data.d["haha"] "n key: www ==> " data.d["www"]); >
}); // <参照パス="jquery-1.4.2-vsdoc.js"/>
$(function() {
$("#btnOK").click(function() {
$.ajax({
type: "Post",
url: "data.aspx/GetHash",
//必ず二重引用符を追加してください T_T
data: "{ 'key ' : 'はは'、'値': 'はは！ ' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert("key: ははは=alert("key: haha = => " data.d["haha"] "n key: www ==> " data.d["www"]);
},
エラー: function(err) {
alert(err "err");
}
});

RM
运行結果：

5、operationxml
XMLtest.xml:

复制代码代码如下:

  
 <アイテム>  
 1  
 qwe  
   
 <アイテム>  
 2  
 asd  
   
 1
 qwe
 
 2
 asd

JQuery コード:

复制代

代码如下:

$(function() { 
 $("#btnOK").click(function() { 
 $.ajax({ 
 url: "XMLtest.xml", 
 dataType: 'xml', //返される型は XML であり、前の Json とは異なります 
 success: function(xml) { 
 success: function(xml) { 
 // リストをクリアします
 $("#list") .html(""); 
 //xml 要素の検索 KVM オンライン ショッピング ブラシ Web サイトの建設 北京エクスプレス カンパニー 超音波溶接機 
 $(xml).find("data> item").each(function() $ ("#list").append("Name:" $(this).find("name").text() "
") ; ,
 error: function(result, status) { //上記でキャプチャされたエラーがない場合、ここのコールバック関数が実行されます>
 //ボタンの送信を無効にする 
 return false; ）; 
}）; ).each(function() {
 >");

 })
 }、
 error: function(result, status) { //キャプチャエラーがない場合上記の場合、ここでのコールバック関数が実行されます 
 }
 });