ASP.NET jQuery 食譜10 (動態修改hyperlink的UR
系統
2786 0
這節我們來看下如何實現通過選擇RadioButtonList值動態改變hyperlink控件的URL值,并簡要介紹bind和live方法的區別。
1.先準備界面代碼:
<
form
id
="form1"
runat
="server"
>
<
div
align
="left"
>
<
fieldset
style
="width: 300px; height: 200px;"
>
<
table
cellpadding
="0"
cellspacing
="0"
border
="0"
>
<
tr
>
<
td
style
="width: 10px"
>
</
td
>
<
td
>
<
p
>
更新網址:
</
p
>
<
asp:RadioButtonList
ID
="rblUrl"
runat
="server"
>
<
asp:ListItem
Text
="新浪"
Value
="http://www.sina.com.cn"
></
asp:ListItem
>
<
asp:ListItem
Text
="百度"
Value
="http://www.baidu.com"
></
asp:ListItem
>
<
asp:ListItem
Text
="網易"
Value
="http://www.163.com"
></
asp:ListItem
>
</
asp:RadioButtonList
>
<
br
/>
<
asp:HyperLink
ID
="hyperLink"
runat
="server"
>
點擊這兒
</
asp:HyperLink
>
</
td
>
</
tr
>
</
table
>
</
fieldset
>
</
div
>
</
form
>
2.
RadioButtonList轉換成<table/>,其成員轉換為<input type="radio"/>,下面是實現改變URL值的腳本代碼:
?
<
head
runat
="server"
>
<
title
>
Recipe10
</
title
>
<
script
src
="Scripts/jquery.js"
type
="text/javascript"
></
script
>
<
script
type
="text/javascript"
>
$(document).ready(
function
() {
$(
"
input[type=radio]
"
).bind(
"
change
"
,
function
() {
$(
"
#<%=hyperLink.ClientID %>
"
).attr(
"
href
"
, $(
this
).val());
});
});
</
script
>
</
head
>
3.實現界面效果:
?
4.另外我們可以通過下面的代碼實現綁定change事件:
$("input=[type=radio]").live("change", function(){
? $("a").attr("href", $(this).val());
});
5.live()和bind()函數的區別:
live()函數可以附加事件到現在的和將來的頁面元素上。然而,bind()函數只能把事件附加到已經加載過的頁面元素上。
也就是說bind()適合頁面靜態元素而live()適合頁面靜態和動態元素。
?
ASP.NET jQuery 食譜10 (動態修改hyperlink的URL值)
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061
微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元