Asp.Net WebService_jquery を呼び出す jQuery Ajax メソッドの詳細なコード例

ws.aspx コード

コードをコピー コードは次のとおりです: .hover { カーソル: ポインタ; /*小手*/ 背景: #ffc; /*背景*/ } .button { 幅: 150px; フロート: 左; text-align: 中央; マージン: 10px; パディング: 10px; ボーダー: 1px ソリッド #888; } #dictionary { text-align: center; フォントサイズ: 18px; クリア: 両方。 ボーダートップ: 3px ソリッド #888; } #loading { ボーダー: 1px #000 ソリッド; 背景色: #eee; パディング: 20px; マージン: 100px 0 0 200px; 位置: 絶対。 表示: なし。 } #switcher { } //パラメータなし $(document).ready(function() { $('#btn1').click(function() { $.ajax({ type: "POST", //访问WebService使用ポスト方式请要求 contentType: "application/json", //WebService 会返しJson 型 url: "WebService1.asmx/HelloWorld", //WebService の地名と名前メソッドの組み合わせ ---- WsURL/メソッド名 data: "{}", //ここは重要なパラメータ、形式は data: "{paraName:paraValue}"、次の会議を参照します dataType: 'json', success: function(result) { //回调関数，result，返值 $('#dictionary').append(result.d); } }); }); //有パラメータ调用 $(document).ready(function() { $("#btn2").click(function() { $.ajax({ type: "POST", contentType: "application/json", url: "WebService1.asmx/GetWish", data: "{value1:'心想事成',value2:'万事如意',value3:'牛牛',value4:2009}", dataType: 'json', success: function(result) { $('#dictionary').append(result. d); } }) }); //返し集合（引用自网络，很说明问题） $(document).ready(function() { $("#btn3").click(function() { $.ajax({ type: "POST", contentType: "application/json", url: "WebService1.asmx/GetArray", data: "{i:10}" , dataType: 'json', success: function(result) { $(result.d).each(function() { //alert(this); $ ('#dictionary').append(this.toString() " "); //alert(result.d.join(" | ")); } }); }); //戻り复合型 $(document).ready(function() { $('#btn4').click(function() { $.ajax({ type: "POST"、 contentType: "application/json"、 url: "WebService1.asmx/GetClass"、 data: "{}"、 dataType: 'json'、 成功: function(result) { $(result.d).each(function() { //alert(this); $('#dictionary').append(this[ 'ID'] " " this['Value']); //alert(result.d.join(" | ")); } }); 🎜>}); }); ============== var aArray = [“sdf”,“dasd”,“dsa”]; //数组$.each(aArray,function(iNum,value){ document.write(“序号：” iNum ” 值：” value);});var oObj = {one:1,two:2,three:3 };$.each(aArray,function(property,value){ document.write(“プロパティ：” property ” 值：” value);}); ============================================== //戻りDataSet(XML) $(document).ready(function() { $('#btn5').click(function() { $.ajax({ type: "POST", url: "WebService1.asmx/GetDataSet", data: "{}", dataType: 'xml', // 返されるタイプは XML 、および先頭のものJson，不一样了 success: function(result) { //演示一下捕获 try { $(result).find("Table1").each(function() { $('#dictionary').append($(this).find("ID").text() " " $(this).find("Value").text()); ); } catch (e) { alert(e); } }, error: function(result, status) { //上に捕捉がない場合はこの場所の回覧関数 if (status == 'error') { alert(status) } }); }); }); //Ajax はユーザーに反馈を提供するために、ajaxStart と ajaxStop メソッドを利用して、ajax を実行して関連イベントの回覧を実行し、他の 2 つのメソッドで jQuery オブジェクトを Ajax の前で回って追加できます //ただし、Ajax の制御、本身は全ローカル性の $(document).ready(function() { $('#loading').ajaxStart(function() { $(this).show(); }).ajaxStop(function() { $(this).hide(); }); // ネズミ标移入移出效果，多元素的時候，可使用“，”隔开 $(document).ready(function() { $('div.button').hover (function() { $(this).addClass('hover'); }, function() { $(this).removeClass('hover'); }); }); ="switcher"> 🎜> 受信パラメータ 返されるコレクション 複合タイプを返す 🎜>Return DataSet(XML) サーバーが処理中です。お待ちください。 /html>

WebService1.asmx.cs

コードをコピーします

コードは次のとおりです。 🎜>

System.Collections.Generic を使用; System.Web を使用; System.Data を使用します。 namespace jQuery.Learning /// /// WebService1 /// [WebService( Namespace = "http://tempuri.org/")] [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.ComponentModel.ToolboxItem(false)] // 許可するにはASP .NET AJAX の使用 この Web サービスをスクリプトから呼び出すには、次の行のコメントを解除します。 [System.Web.Script.Services.ScriptService] public class WebService1 : System.Web.Services.WebService { /// /// パラメータなし /// /// [WebMethod] public string HelloWorld() { return "こんにちはWorld "; } /// /// パラメーターあり /// /// /// /// 🎜>/// /// [WebMethod] public string GetWish(string value1) , string value2, string value3, int value4) { return string.Format("{3} 年後に {0}、{1}、{2} をお祈りします", value1, value2, value3, value4 ); } /// /// コレクションを返す /// ; /// [WebMethod] public List { List (); while (i >= 0) list.Add(i--); return } /// /// 複合型を返します /// /// >[WebMethod] public Class1 GetClass() { return new Class1 { ID = "1", Value = "丑年もよろしく" }; /// /// XML を返す /// /// [WebMethod] public DataSet GetDataSet() { DataSet ds = new DataSet(); DataTable dt = new DataTable(); dt.Columns.Add("ID", Type.GetType("System .String") ); dt.Columns.Add("Value", Type.GetType("System.String")); DataRow dr = dt.NewRow(); dr["ID "] = " 1"; dr["Value"] = "明けましておめでとうございます"; dt.Rows.Add(dr); dr = dt.NewRow(); dr ["ID"] = "2"; dr["Value"] = "頑張ってください"; dt.Rows.Add(dr); return ds; } } //カスタマイズされたクラス、2 つの属性のみ public class Class1 { public string ID { get;パブリック文字列値 { セット; } }