ASP.NET jQuery 实例10 动态修改hyperlink的URL值

技术文章

ASP.NET jQuery 实例10 动态修改hyperlink的URL值

时间：2012-02-03 点击：103

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()适合页面静态和动态元素。

JSON 数据格式介绍

ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)

基于jquery点击自以外任意处，关闭自身的代码

jquery中的mouseleave和mouseout的区别模仿下拉框效果

JavaScript 5 新增 Array 方法实现介绍

> 返回