快捷導(dǎo)航

jquery調(diào)用asp.net 頁(yè)面后臺(tái)的實(shí)現(xiàn)代碼

更新時(shí)間：2011年04月27日 21:46:50 作者：

前一篇介紹jquery調(diào)用webservice，這一篇引用的是用jquery直接調(diào)用aspx后臺(tái)方法。

先創(chuàng)建一個(gè)aspx頁(yè)面編寫(xiě)一個(gè)客戶(hù)端控件<input type="button" id="AjaxDemo"
value="AjaxDemo">
再aspx后臺(tái)的頁(yè)面編寫(xiě)一個(gè)簡(jiǎn)單的方法,代碼如下:

復(fù)制代碼代碼如下:

 
[WebMethod] 
public static string ABC(string ABC) 
{ 
return ABC; 
} 

必須聲明為靜態(tài)方法，并且它們必須使用 [WebMethod] 特性標(biāo)注。但是在webservice里面不必是靜態(tài)方法，它的對(duì)象可以是list、dataset、class對(duì)象等……
接下來(lái)就應(yīng)該考慮怎么讓前臺(tái)的客戶(hù)端控件調(diào)用到后臺(tái)的方法了..這時(shí)jqury登場(chǎng)了..
在頁(yè)面引入jquery類(lèi)庫(kù)
<script type="text/javascript"
src="JQuery/jquery-1.3.2-vsdoc2.js"></script>
在頁(yè)面添加腳本代碼如下:

復(fù)制代碼代碼如下:

 
<script type="text/javascript"> 
$().ready( function() { 
　　$("#AjaxDemo").click(function() { 
　　　　$.ajax({ 
type: "POST", 
　　　　　　　　url: "Default.aspx/ABC", 
data: "{'ABC':'test'}", 
contentType: "application/json; charset=utf-8", 
success: function(msg) {alert(msg); } 
}) 
}) 
} 
) 
</script > 

這樣就大功告成了!很多事情都是jquery類(lèi)庫(kù)幫我們做完了,我們這里討論的是如何用,具體里面怎么實(shí)現(xiàn),我們不關(guān)心!
jquery里還有很多像$.ajax這樣的方法提供給我們使用.大家可以試試!
補(bǔ)充：注意要建3.5的項(xiàng)目，如果是2.0的話(huà)。配置文件會(huì)少很多引用的，如果你建的是2.0項(xiàng)目的話(huà)。建個(gè)3.5的。把3.5的配置文件覆蓋到2.0的項(xiàng)目即可！
上面的代碼如果成功之后彈出的是"{d:test}",是因?yàn)樗祷氐氖亲址?我們可以將他改成返回json對(duì)象.
把jquery代碼修改如下

復(fù)制代碼代碼如下:

 
$().ready( 
function() { 
$("#AjaxDemo").click(function() { 
　　$.ajax({ 
type: "POST", 
　　　　　　url: "Default.aspx/ABC", 
data: "{'ABC':'test'}", 
dataType: "json", 
contentType: "application/json; charset=utf-8", 
success: function(msg) {alert(msg.d); } 
}) 
}) 
} 
} 

我們?cè)O(shè)置他返回的數(shù)據(jù)是json對(duì)象,現(xiàn)在我們可以用返回的json對(duì)象,根據(jù)彈出來(lái)的d:test,我們可以很明顯看到key是d,值是test,那我們利用返回的數(shù)據(jù)msg對(duì)象直接點(diǎn)d,就可以獲得test的,修改了代碼之后.現(xiàn)在彈出來(lái)就是test了..

您可能感興趣的文章: