如何实现html中radio的readonly?
readonly写在radio里没有用处,网上查了一下,说radio没有readonly属性。
请教:如何实现radio的readonly效果(既要只读,还要能传值)?谢谢。 展开
推荐于2016-04-18 · 知道合伙人软件行家
html中radio的用法:
radio分组 :只要name一样,就是一组的,即一组中只能选择一个,如下:
<span>group1:</span>
<input type="radio" id="radio1" checked="checked" name="group1" />radio1
<input type="radio" id="radio2" name="group1" />radio2
<input type="radio" id="radio3" name="group1" />radio3
<span>group2:</span>
<input type="radio" id="radio4" checked="checked" name="group2" />radio4
<input type="radio" id="radio5" name="group2" />radio5
<input type="radio" id="radio6" name="group2" />radio6
获取选中的radio节点:使用jquery可以很方便做到,先选择group,然后过滤出checked的,如下
var group1 = $("[name='group1']").filter(":checked");
console.log(group1.attr("id"));
选中一个radio节点:使用jquery设置checked属性,如下
$("#radio2").attr("checked", "checked");
去选中一个radio节点 移除checked属性,如下
$("#radio1").removeAttr("checked");
这样做的结果可能造成一组radio中没有一个处于选中状态
注册选中去选中事件:还是使用jquery的on函数来注册change事件,如下:
$("[name='group1']").on("change",
function (e) {
console.log($(e.target).val());
}
);
这样只要group1中任何一个有选中的,就会触发函数
可以直接使用input的readonly属性来实现的,示例代码如下:
<input type="radio" readonly="readonly" />
这样子这个radio就是只读状态的了。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<SCRIPT LANGUAGE="JavaScript">
<!--
function aa(index){
document.all("a")[index].checked=true;
document.all("t").value=document.all("a")[index].value;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<INPUT TYPE="radio" NAME="a" value="0" disabled="true">男
<INPUT TYPE="radio" NAME="a" value="1" disabled="true">女<br>
radio的值<INPUT TYPE="text" NAME="t"><br>
<INPUT TYPE="button" NAME="" value="选中第一个" onclick="aa(0)">
<INPUT TYPE="button" NAME="" value="选中第二个" onclick="aa(1)">
</BODY>
</HTML>
如果只是显示的话用个lable不就行了.传值用hide不也可以吗?
如果只是显示的话用个lable不就行了.传值用hide不也可以吗?
答题不易,互相理解,您的采纳是我前进的动力,
您也可以向我们团队发出请求,会有更专业的人来为您解答。
如果我的回答没能帮助您,请继续追问。