JQuery Ajax WebService傳遞參數(shù)的簡(jiǎn)單實(shí)例
Asp.NET中利用jQuery實(shí)現(xiàn)Ajax時(shí),在服務(wù)器端可以使用aspx,ashx,以及WebService等方式。最近研究了一下WebService方式,jQuery Ajax 方法調(diào)用 jQuery Ajax方法調(diào)用 Asp.Net WebService 的詳細(xì)實(shí)例代碼這篇帖子給出了很詳細(xì)的例子,不過(guò)沒(méi)有給出詳細(xì)解釋。其中有幾個(gè)細(xì)節(jié)問(wèn)題開(kāi)始沒(méi)注意,費(fèi)老勁才調(diào)通:
1)客戶端data數(shù)據(jù)中的key字段名稱必須和服務(wù)器端方法參數(shù)嚴(yán)格一致。
如客戶端:
//有參數(shù)調(diào)用
$(document).ready(function () {
$("#btn2").click(function () {
$.ajax({
type: "POST",
contentType: "application/json",
url: "WebService.asmx/GetWish",
data: "{value1:'心想事成',value2:'萬(wàn)事如意',value3:'牛牛牛',value4:2009}",
dataType: 'json',
success: function (result) {
$('#dictionary').append(result.d);
}
});
});
});
服務(wù)器端的GetWish函數(shù)參數(shù)必須寫(xiě)成value1,value2,value3,value4:
[WebMethod]
public string GetWish(string value1, string value2, string value3, int value4)
{
return string.Format("祝您在{3}年里 {0}、{1}、{2}", value1, value2, value3, value4);
}
2)客戶端傳遞對(duì)象到服務(wù)器端的方法:
客戶端代碼:
//傳入對(duì)象
$(function () {
$("#btn6").click(function () {
obj = new Object();
obj.ID = "1";
obj.Value = "aaa";
//'{"obj":{"ID":"1",Value:"Horse"}}'
var d = '{"obj":' + JSON.stringify(obj) + '}';
$.ajax({
type: "POST", //訪問(wèn)WebService使用Post方式請(qǐng)求
contentType: "application/json", //WebService 會(huì)返回Json類型
url: "WebService.asmx/ParmsObject", //調(diào)用WebService的地址和方法名稱組合 ---- WsURL/方法名
data: d, //這里是要傳遞的參數(shù),格式為 data: "{paraName:paraValue}",下面將會(huì)看到
dataType: 'json',
success: function (result) {
alert(result.d);
},
error: function (result) {
alert("fail");
}
});
});
});
服務(wù)器端代碼:
[WebMethod]
public string ParmsObject(Class1 obj)
{
return obj.ID + ":" + obj.Value;
}
調(diào)試環(huán)境:VS2010+jquery-1.3.2.min.js
以上就是小編為大家?guī)?lái)的JQuery Ajax WebService傳遞參數(shù)的簡(jiǎn)單實(shí)例全部?jī)?nèi)容了,希望大家多多支持腳本之家~
相關(guān)文章
基于jQuery實(shí)現(xiàn)Ajax驗(yàn)證用戶名是否存在實(shí)例
這篇文章主要為大家詳細(xì)介紹了基于jQuery實(shí)現(xiàn)Ajax驗(yàn)證用戶名是否存在實(shí)例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-03-03
JQuery 學(xué)習(xí)筆記 element屬性控制
JQuery元素屬性控制2009-07-07
jQuery + Flex 通過(guò)拖拽方式動(dòng)態(tài)改變圖片的代碼
功能終于告一段落了,實(shí)現(xiàn)了預(yù)期的功能。遇到了一個(gè)小麻煩,js 會(huì)把某些變量( 如果你是通過(guò)對(duì)象的方式傳遞的,將在傳遞之后丟失類型信息 ,后面*號(hào)部分)2011-08-08
jquery實(shí)現(xiàn)簡(jiǎn)單的二級(jí)導(dǎo)航下拉菜單效果
這篇文章主要介紹了jquery實(shí)現(xiàn)簡(jiǎn)單的二級(jí)導(dǎo)航下拉菜單效果,涉及jquery鼠標(biāo)事件動(dòng)態(tài)操作頁(yè)面元素樣式及Ajax調(diào)用的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09

