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/