Jquery Ajax學(xué)習(xí)實例3 向WebService發(fā)出請求,調(diào)用方法返回數(shù)據(jù)
更新時間:2010年03月16日 18:16:35 作者:
Jquery Ajax學(xué)習(xí)實例3 向WebService發(fā)出請求,調(diào)用方法返回數(shù)據(jù)
一、WebService.asmx
處理業(yè)務(wù)數(shù)據(jù),在GetWhether方法中產(chǎn)生天氣情況數(shù)據(jù),供JqueryRequest.aspx調(diào)用,代碼如下:
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
public WebService () {
//如果使用設(shè)計的組件,請取消注釋以下行
//InitializeComponent();
}
[WebMethod]
public string GetWhether(string cityId)
{
Random r = new Random();
int degree = r.Next(100);
string wInfo = string.Format("Today {0}'s temperature is {1} degrees", cityId, degree);
return wInfo;
}
}
二、AjaxRequest.aspx
通過點擊按鈕來請求WebService.asmx的GetWhether(string cityId)方法,獲取天氣數(shù)據(jù)。代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript" src="js/jquery-1.3.2.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="text" name="Text1" id="Text1"/><br />
<input type="text" name="Text2" id="Text2"/>
<br />
<input type="button" id="btn1" onclick="BtnCity_Click()"
style="width:55px; height:20px;" />
</div>
<div id="dd">
sd
</div>
<div>
<script type="text/javascript" language="javascript">
function BtnCity_Click() {
var city = $("#Text1").val();
$.ajax({
url: "WebService.asmx/GetWhether",
data: { cityId: city },
type: "post",
success: function(data, status) {
$("#dd").html("<h1>天氣情況:" + data.childNodes[1].text + "</h1>");
}
});
}
</script>
</div>
</form>
</body>
</html>
處理業(yè)務(wù)數(shù)據(jù),在GetWhether方法中產(chǎn)生天氣情況數(shù)據(jù),供JqueryRequest.aspx調(diào)用,代碼如下:
復(fù)制代碼 代碼如下:
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
public WebService () {
//如果使用設(shè)計的組件,請取消注釋以下行
//InitializeComponent();
}
[WebMethod]
public string GetWhether(string cityId)
{
Random r = new Random();
int degree = r.Next(100);
string wInfo = string.Format("Today {0}'s temperature is {1} degrees", cityId, degree);
return wInfo;
}
}
二、AjaxRequest.aspx
通過點擊按鈕來請求WebService.asmx的GetWhether(string cityId)方法,獲取天氣數(shù)據(jù)。代碼如下:
復(fù)制代碼 代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" language="javascript" src="js/jquery-1.3.2.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="text" name="Text1" id="Text1"/><br />
<input type="text" name="Text2" id="Text2"/>
<br />
<input type="button" id="btn1" onclick="BtnCity_Click()"
style="width:55px; height:20px;" />
</div>
<div id="dd">
sd
</div>
<div>
<script type="text/javascript" language="javascript">
function BtnCity_Click() {
var city = $("#Text1").val();
$.ajax({
url: "WebService.asmx/GetWhether",
data: { cityId: city },
type: "post",
success: function(data, status) {
$("#dd").html("<h1>天氣情況:" + data.childNodes[1].text + "</h1>");
}
});
}
</script>
</div>
</form>
</body>
</html>
您可能感興趣的文章:
- Jquery + Ajax調(diào)用webService實例代碼(asp.net)
- jQuery AJAX 調(diào)用WebService實現(xiàn)代碼
- 關(guān)于jquery ajax 調(diào)用帶參數(shù)的webservice返回XML數(shù)據(jù)一個小細節(jié)
- jQuery Ajax方法調(diào)用 Asp.Net WebService 的詳細實例代碼
- asp.net下使用jquery 的ajax+WebService+json 實現(xiàn)無刷新取后臺值的實現(xiàn)代碼
- Jquery ajax傳遞復(fù)雜參數(shù)給WebService的實現(xiàn)代碼
- Jquery Ajax學(xué)習(xí)實例6 向WebService發(fā)出請求,返回DataSet(XML) 異步調(diào)用
- Jquery Ajax學(xué)習(xí)實例4 向WebService發(fā)出請求,返回實體對象的異步調(diào)用
- Jquery Ajax學(xué)習(xí)實例5 向WebService發(fā)出請求,返回泛型集合數(shù)據(jù)的異步調(diào)用
- jQuery ajax調(diào)用webservice注意事項
相關(guān)文章
jQuery動畫效果實現(xiàn)圖片無縫連續(xù)滾動
這篇文章主要為大家介紹了jQuery動畫效果實現(xiàn)圖片無縫連續(xù)滾動,實現(xiàn)類似連續(xù)不間斷的滾動廣告位,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-01-01jquery點擊獲取動態(tài)數(shù)據(jù)進行傳參問題
這篇文章主要介紹了jquery點擊獲取動態(tài)數(shù)據(jù)進行傳參問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-12-12有關(guān)jQuery中parent()和siblings()的小問題
本文通過一個實例給大家介紹有關(guān)parent()和siblings()問題原因及解決方案,非常不錯具有參考借鑒價值,感興趣的朋友一起看看吧2016-06-06基于jQuery實現(xiàn)中英文切換導(dǎo)航條效果
這篇文章主要為大家詳細介紹了基于jQuery實現(xiàn)中英文切換導(dǎo)航條效果,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-09-09jQuery實現(xiàn)調(diào)整表格單列順序完整實例
這篇文章主要介紹了jQuery實現(xiàn)調(diào)整表格單列順序的方法,結(jié)合完整實例形式分析了jQuery響應(yīng)鼠標事件及動態(tài)操作頁面元素的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2016-06-06jqGrid增加時--判斷開始日期與結(jié)束日期(實例解析)
jqGrid增加時--判斷開始日期與結(jié)束日期(實例代碼)。需要的朋友可以過來參考下,希望對大家有所幫助2013-11-11