radaio ：单选按钮
html:
<input type="radio" name="city" value="广州" id="myCheck"/> 广州
通过Name 来分组，需要初始化化选中状态时 一组radio 只能选中一个值， 需要添加 checked 属性 无需赋值。
disabled: 设置是元素的启用状态： 可以不需要赋值，或者 disabled='disabled'
DOM:
实现元素type值：radio
checked=true/false 设置选中状态
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> function check() { //document.getElementById("myCheck").addAttribute("checked","checked"); document.getElementById("myCheck").checked = true; //推荐用法 } function uncheck() { //document.getElementById("myCheck").removeAttribute("checked"); document.getElementById("myCheck").checked = false; } function getcheck() { alert(document.getElementById("myCheck").checked); // 输出 boolean 值 true 或者false } function doDisabled(obj) { var cb = document.getElementById("myCheck"); console.log(cb.disabled); if(cb.disabled) { // cb.disabled=null; cb.disabled = false; cb.removeAttribute("disabled"); obj.value = "禁用checkbox"; } else { //cb.setAttribute("disabled","disabled"); cb.disabled = true; //cb.disabled="disabled"; obj.value = "启用checkbox"; } } //获取选中的值
function getCheckValue()
{
var cbs=document.getElementsByName("city");
var vchecked="";
for(var i=0;i<cbs.length;i++)
{
if(cbs[i].checked){
vchecked=cbs[i].value;
}
}
alert(vchecked);
}
</script> </head> <body> <input type="radio" disabled="disabled" checked="checked" name="city" value="上海" /> 上海 <input type="radio" name="city" value="广州" id="myCheck"/> 广州 <input type="radio" name="city" value="北京" /> 北京 <input type="radio" name="city" value="深圳"/>深圳 <input type="button" onclick="check()" value="选定复选框" /> <input type="button" onclick="uncheck()" value="取消选定复选框" /> <input type="button" onclick="getcheck()" value="获取选定复选框状态" /> <input type="button" onclick="doDisabled(this)" value="禁用radio" /> <input type="button" onclick="getCheckValue()" value="获取选择的值"/> </body> </html>
jquery
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="../javascript/jquery-1.10.2.js"></script> <script type="text/javascript"> function check() { $("#myCheck").prop("checked",true) } function uncheck() { $("#myCheck").prop("checked",false); } function getcheck() { //alert(document.getElementById("myCheck").checked); // 输出 boolean 值 true 或者false alert($("#myCheck").prop("checked")); } function doDisabled(obj) { // debugger; if($("#myCheck").prop("disabled")) { $("#myCheck").prop("disabled",false); obj.value = "禁用checkbox"; }else{ $("#myCheck").prop("disabled",true); obj.value = "启用checkbox"; } } //获取选中的值 function getCheckValue() { alert($("input[name='city']:checked").eq(0).val()); } </script> </head> <body> <form> <input type="radio" id="myCheck" name="city" value="上海" name="city" /> 上海 <input type="radio" name="city" value="北京" name="city" /> 北京 <input type="radio" name="city" value="深圳" name="city" /> 深圳 <input type="radio" name="city" value="广州" name="city" /> 广州 <input type="button" onclick="check()" value="选定复选框" /> <input type="button" onclick="uncheck()" value="取消选定复选框" /> <input type="button" onclick="getcheck()" value="获取选定复选框状态" /> <input type="button" onclick="doDisabled(this)" value="禁用checkbox" /> <input type="button" onclick="getCheckValue()" value="获取选择的值"/> </form> </body> </html>