如何用javascript动态改变a标签的href属性
发布网友
发布时间:2022-04-29 02:25
我来回答
共2个回答
热心网友
时间:2022-04-23 12:38
楼主,checkbox更改a的href属性,就说明有多选的情况影响url,这个url需要楼主有个预处理哦,比如
if(ck1.checked) url="?";
if(ck1.checked && ck3.checked) url="?"
因为获取checkbox组的checked状态需要循环来处理,所以这个预定义的状态需要好好考虑如何在循环中体现,在此不做多考虑,以下给个简单的获取checkbox状态来设置a标签的href属性的小例子:
<script>
function seturl(){
var ckboxs = document.getElementsByName("ck");
var state = "000";//设置状态位,当然也可以直接要求返回所选checkbox的值,看具体情况
for(var i=0;i<ckboxs.length;i++){
if(ckboxs[i].checked) state=state.substr(0,i)+"1"+state.substr(i+1,state.length-i);
}
//再根据状态位设置a标签的href
var el_a = document.getElementById("mylink");
switch(state){
case "001":
el_a.href="http://www.baidu.com/";break;
case "010":
el_a.href="http://www.baidu.com/";break;
//诸多状态省略
}
}
//循环体中设置状态位只是一种方法,可以返回楼主自己想要的结果,这个需要楼主自己考虑哦
</script>
<div>
<input type="checkbox" name="ck" id="ck1" onclick="seturl()"/>1<br>
<input type="checkbox" name="ck" id="ck2" onclick="seturl()"/>2<br>
<input type="checkbox" name="ck" id="ck3" onclick="seturl()"/>3<br>
<a id="mylink" href="" >动态链接</a>
<input type="button" onclick="alert(eval('mylink').href)" value="ok"/>
//测试按钮来alert
</div>
热心网友
时间:2022-04-23 13:56
小例子
<script>
function ch(temp)
{
a=document.getElementById("link");
a.innerHTML="<a href="+ temp +" target=_blank>友情链接</a>";
}
</script>
<p>
<select name="s" id="s" onchange="ch(this.value)">
<option value="http://www.baidu.com">链接1</option>
<option value="http://www.sina.com.cn">链接2</option>
<option value="http://www.sohu.com.cn">链接3</option>
</select>
</p>
<div id="link"><a href="">友情链接</a></div>