解决方案 »
- 关于jQuery如何点击图片后生成新的DIV显示大图的问题
- 散分讲论:WEB开发的未来
- extjs 动态显示 隐藏组件问题
- javascript中var a = $get(e)这是什么意思?
- 能被80整除并,返回逻辑的过程怎么写?
- 谁能用javascript写个进度条,并且让进度条在指定时间范围内(20秒)由零刻度逐渐增至满刻度?
- 请问javascript 中延时的语法是什么?(举个例子)
- 输入框失焦事件,大部分情况都无法响应,是什么原因呢???
- jquery接收json格式的api的问题
- 如何实现等于号动态的变为一个叉号?如图
- jquery validate 失去焦点的时间不能触发
- jquery实现超出截取 以省略结束
定义一个变量,来判断选中的是哪一个,再次选中时,变量将和选中一样,这是在取消选中即可
对于第二个问题:
给每一个input,加一个div,同控制div隐藏,来控制inpu的显示
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(":radio").click(function() {
//alert($(this).val());
//alert($(this).attr("checked"));
var flag = $(this).attr("checked") == "checked" ? false : "checked";
if(flag == "checked") {
$(this).next().attr("type","text");
} else {
$(this).next().attr("type","hidden");
}
$(this).attr("checked", flag);
})
})
</script>
</head>
<body>
<input name="1" type="radio" value="1" />第一个<input type="hidden" />
<input name="2" type="radio" value="2" />第二个<input type="hidden" />
<input name="3" type="radio" value="3" />第三个<input type="hidden" />
<input name="4" type="radio" value="4" />第四个<input type="hidden" />
<input name="5" type="radio" value="5" />第五个<input type="hidden" />
</body>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(":radio").click(function() {
//alert($(this).val());
//alert($(this).attr("checked"));
var flag = $(this).attr("checked") == "checked" ? false : "checked";
if(flag == "checked") {
$(this).next().attr("type","text");
} else {
$(this).next().attr("type","hidden");
}
$(this).attr("checked", flag);
})
})
</script>
</head>
<body>
<input name="1" type="radio" value="1" />第一个<input type="hidden" />
<input name="2" type="radio" value="2" />第二个<input type="hidden" />
<input name="3" type="radio" value="3" />第三个<input type="hidden" />
<input name="4" type="radio" value="4" />第四个<input type="hidden" />
<input name="5" type="radio" value="5" />第五个<input type="hidden" />
</body>
</html>代码贴全了 楼主可以参考下
IE10上面没有效果
IE中radio的选中 貌似是用true 来表示的 改成下面的试试var flag = $(this).attr("checked") ? false : true;
if(flag) {
$(this).next().attr("type","text");
} else {
$(this).next().attr("type","hidden");
}
<input name="2" type="radio" />第二个<input type="text" style="display: none">
<input name="3" type="radio" />第三个<input type="text" style="display: none">
<input name="4" type="radio" />第四个<input type="text" style="display: none">
<input name="5" type="radio" />第五个<input type="text" style="display: none">
<script type="text/javascript">
window.onload = function(){
var inputs = document.getElementsByTagName("input");
for(var i= inputs.length;--i>=0;){
inputs[i].index = 0;
inputs[i].onclick = function(){
getNextSibling(this).style.display = (this.checked = !(this.index++%2)) ? "inline" : "none";
}
}
};
function getNextSibling(obj){
var next=obj.nextSibling;
while(next.nodeType!=1){
next = next.nextSibling;
}
return next;
}
</script>IE禁止修改type所以考虑使用display隐藏或显示