Javascript检查单选按钮是否被选中？

Question

我发现，这样做的脚本，但他们只用一个单选按钮的名称的工作，我有5个不同的单选按钮组。我如何检查，如果它现在选择我现在表格提交

if(document.getElementById('radiogroup1').value=="") { 
     alert("Please select option one"); 
     document.getElementById('radiogroup1').focus(); 
     return false; 
    } 

不起作用。

Answer 1

这里有一个很好的教程 - >http://www.somacon.com/p143.php

---

// return the value of the radio button that is checked 
// return an empty string if none are checked, or 
// there are no radio buttons 
function getCheckedValue(radioObj) { 
    if(!radioObj) return ""; 
    var radioLength = radioObj.length; 
    if(radioLength == undefined) 
     if(radioObj.checked) return radioObj.value; 
     else return ""; 
    for(var i = 0; i < radioLength; i++) { 
     if(radioObj[i].checked) return radioObj[i].value; 
    } 
    return ""; 
} 

// set the radio button with the given value as being checked 
// do nothing if there are no radio buttons 
// if the given value does not exist, all the radio buttons 
// are reset to unchecked 
function setCheckedValue(radioObj, newValue) { 
    if(!radioObj) return; 
    var radioLength = radioObj.length; 
    if(radioLength == undefined) { 
     radioObj.checked = (radioObj.value == newValue.toString()); 
     return; 
    } 
    for(var i = 0; i < radioLength; i++) { 
     radioObj[i].checked = false; 
     if(radioObj[i].value == newValue.toString()) radioObj[i].checked = true; 
    } 
} 

Answer 2

var checked = false, radios = document.getElementsById('radiogroup1'); 
for (var i = 0, radio; radio = radios[i]; i++) { 
    if (radio.checked) { 
     checked = true; 
     break; 
    } 
} 

if (!checked) { 
    alert("Please select option one"); 
    radios.focus(); 
    return false; 
} 

return true; 

Answer 3

你没事用jQuery？如果是这样的：

$(document).ready(function(){ 
    if($('input[type=radio]:checked').length == 0) 
    { 
     alert("Please select option one");   
     document.getElementById('radiogroup1').focus();   
     return false;  
    } 
} 

Answer 4

如果你有你的心脏上使用标准的JavaScript然后设置：

函数定义

var isSelected = function() { 
    var radioObj = document.formName.radioGroupName; 

    for(var i=0; i<radioObj.length; i++) { 
     if(radioObj[i].checked) { 
      return true; 
     } 
    } 

    return false; 
}; 

使用

if(!isSelected()) { 
    alert('Please select an option from group 1 .'); 
} 

我会建议使用g jQuery。它有很多选择器选项，它们在一起使用时将大部分代码简化为单行。

替代的解决方案

if($('input[type=radio][name=radioGroupName]:selected').length == 0) { 
    alert('Please select an option from group 1 .'); 
} 

Answer 5

一个很简单的功能是：

<script type="text/javascript"> 

function checkRadios(form) { 
    var btns = form.r0; 
    for (var i=0; el=btns[i]; i++) { 
    if (el.checked) return true; 
    } 
    alert('Please select a radio button'); 
    return false; 
} 
</script> 

<form id="f0" onsubmit="return checkRadios(this);"> 
    one<input type="radio" name="r0"><br> 
    two<input type="radio" name="r0"><br> 
    three<input type="radio" name="r0"><br> 
    <input type="submit"> 
</form> 

但是，你前人的精力总是在默认情况下（即与选择属性）选择一个单选按钮，一些用户代理可以自动选择第一个按钮。然后你只需要检查默认（通常是第一个）是否被选中。

Answer 6

为什么不直接使用oneliner？

我写了这个代码，它将提交表单如果至少一个无线电检查：

(function(el){for(var i=el.length;i--;) if (el[i].checked) return el[i].form.submit()||1})(document.form_name.radio_name)||alert('please select item') 

否则就会使警报。或者你也可以修改它与形式的onsubmit使用：

return (function(el){for(var i=el.length;i--;) if (el[i].checked) return 1})(document.form_name.radio_name)||alert('please select item') 

只需更换form_name和radio_name相应。

看看它是如何工作的：http://jsfiddle.net/QXeDv/5/