如何檢查單選按鈕使用JavaScript

Question

這是我的html代碼：

<input type="radio" name="sex" id="boy" value="male" /> Boy<p></p><br> 
<input type="radio" name="sex" id="girl" value="female" />Girl 
<button id="fine" type="button">Submit</button> 

，這是在我的JavaScript文件：

var maskio = document.getElementById('boy'); 
    var femmna = document.getElementById('girl'); 
    function prima(){ 
    var fine = document.getElementById('fine'); 
    fine.onclick=chek; 
    } 
    function chek(){ 
    if((maskio.checked == false) && (femmna.checked == false)) { 
    alert('lol'); 
    return false; 
    } 
    } 
window.onload=prima; 

問題出在哪裏？當我運行它並單擊提交沒有任何反應。爲什麼？

Answer 1

改變你的JS如下。這些元素不是在你獲得它們的時候創建的。

function prima() { 
    var fine = document.getElementById('fine'); 
    fine.onclick = chek; 
} 

function chek() { 
    var maskio = document.getElementById('boy'); 
    var femmna = document.getElementById('girl'); 
    if ((maskio.checked == false) && (femmna.checked == false)) { 
     alert('lol'); 
     return false; 
    } 
} 

window.onload=prima; 

入住這裏：jsFiddle

Answer 2

當單選按鈕具有相同的名稱，它們都屬於該組的名稱。這意味着，只能選擇一個組中的一個無線電按鈕。如果您同時選中，無論如何都不會有結果！

Answer 3

的問題是你的HTML標籤，有一個空格「<」刪除空間，它會正常工作......

<input type="radio" name="sex" id="boy" value="male" /> Boy 
<p></p><br> 
<input type="radio" name="sex" id="girl" value="female" /> Girl 
<button id="fine" type="button">Submit</button> 
<script> 

var maskio = document.getElementById('boy'); 
var femmna = document.getElementById('girl'); 
function prima() 
{ 
    var fine = document.getElementById('fine'); 
    fine.onclick=chek; 
} 
function chek() 
{ 
    if(maskio.checked) 
    { 
     alert("You are male Eh?"); 
    } 
    else if(femmna.checked) 
    { 
     alert("Femal ;)"); 
    } 
    else if(!maskio.checked && !femmna.checked) 
    { 
     alert("Come on Please check something!"); 
    } 
} 
    window.onload=prima; 

</script>