Jquery Ajax學(xué)習(xí)實(shí)例3 向WebService發(fā)出請(qǐng)求，調(diào)用方法返回?cái)?shù)據(jù)
更新時(shí)間：2010年03月16日 18:16:35 作者：
Jquery Ajax學(xué)習(xí)實(shí)例3 向WebService發(fā)出請(qǐng)求，調(diào)用方法返回?cái)?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è)計(jì)的組件，請(qǐng)取消注釋以下行
//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
通過(guò)點(diǎn)擊按鈕來(lái)請(qǐng)求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è)計(jì)的組件，請(qǐng)取消注釋以下行
//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
通過(guò)點(diǎn)擊按鈕來(lái)請(qǐng)求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實(shí)例代碼(asp.net)
- jQuery AJAX 調(diào)用WebService實(shí)現(xiàn)代碼
- 關(guān)于jquery ajax 調(diào)用帶參數(shù)的webservice返回XML數(shù)據(jù)一個(gè)小細(xì)節(jié)
- jQuery Ajax方法調(diào)用 Asp.Net WebService 的詳細(xì)實(shí)例代碼
- asp.net下使用jquery 的ajax+WebService+json 實(shí)現(xiàn)無(wú)刷新取后臺(tái)值的實(shí)現(xiàn)代碼
- Jquery ajax傳遞復(fù)雜參數(shù)給WebService的實(shí)現(xiàn)代碼
- Jquery Ajax學(xué)習(xí)實(shí)例6 向WebService發(fā)出請(qǐng)求，返回DataSet(XML) 異步調(diào)用
- Jquery Ajax學(xué)習(xí)實(shí)例4 向WebService發(fā)出請(qǐng)求，返回實(shí)體對(duì)象的異步調(diào)用
- Jquery Ajax學(xué)習(xí)實(shí)例5 向WebService發(fā)出請(qǐng)求，返回泛型集合數(shù)據(jù)的異步調(diào)用
- jQuery ajax調(diào)用webservice注意事項(xiàng)
相關(guān)文章
jQuery代碼實(shí)現(xiàn)表格中點(diǎn)擊相應(yīng)行變色功能
對(duì)于一個(gè)表格，為了更好的用戶體驗(yàn)度，需要把選中的表格項(xiàng)添加高亮，下面小編給大家介紹使用jquery實(shí)現(xiàn)表格中點(diǎn)擊相應(yīng)行變色功能的實(shí)例代碼，需要的朋友參考下2016-05-05
在Discuz! 6.1中無(wú)法直接使用jQuery，此時(shí)對(duì)/include/javascript/common.js文件應(yīng)用如下補(bǔ)丁即可。
2008-09-09 
jquery實(shí)現(xiàn)九宮格大轉(zhuǎn)盤抽獎(jiǎng)
jQuery九宮格大轉(zhuǎn)盤抽獎(jiǎng)代碼網(wǎng)頁(yè)特效，點(diǎn)擊抽獎(jiǎng)按鈕開(kāi)始隨機(jī)抽獎(jiǎng)選擇獎(jiǎng)品，可設(shè)置起點(diǎn)位置、獎(jiǎng)品數(shù)量、轉(zhuǎn)動(dòng)次數(shù)、中獎(jiǎng)位置參數(shù)
2015-11-11 
這篇文章主要介紹了JQuery綁定事件四種實(shí)現(xiàn)方法解析,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-12-12 
這篇文章主要介紹了jQuery隨機(jī)密碼生成的方法,實(shí)例分析了jQuery操作隨機(jī)數(shù)的技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03 
本文通過(guò)實(shí)例代碼給大家介紹了jquery 雙擊編輯表格，需要的朋友參考下吧
2017-06-06 
設(shè)置jQueryUI DatePicker默認(rèn)語(yǔ)言為中文
本文主要介紹jQueryUI DatePicker設(shè)置中文的方法，需要的朋友可以參考下。
2016-06-06 
這篇文章主要介紹了Jquery動(dòng)態(tài)添加輸入框的方法,實(shí)例分析了jQuery中append方法添加頁(yè)面元素的使用技巧,需要的朋友可以參考下
2015-05-05 
2014年50個(gè)程序員最適用的免費(fèi)JQuery插件
這篇文章主要介紹了2014年50個(gè)程序員最適用的免費(fèi)JQuery插件,需要的朋友可以參考下
2014-12-12