檢查是否有多個單選按鈕被選中

Question

我不是很擅長Javascript，所以我想請求以下幫助： 我有一個表單，它有多個廣播組（由php代碼生成，所以我不用不知道他們的名字，或者會出現多少人），我需要檢查他們是否被選中。 如果不是，我想向用戶顯示哪個問題沒有回答（沒有提示消息，但可以是文本形式或問題字母變成紅色）。

我試着用Google搜索這個問題，但以前的答案都不是很好用在我的情況。

這是到目前爲止我的代碼：

function formCheck(formID) { 
 
var eLabel=document.getElementById(formID).getElementsByTagName("label"); 
 
var radionames=[]; 
 
var eInput=document.getElementById(formID).getElementsByTagName("input"); 
 
var checker=true; 
 
for (var i=0; i<eInput.length; i++) { 
 
\t if (eInput[i].checked) { 
 
\t \t radionames.push(eInput[i].name); 
 
\t } 
 
} 
 
for (var i=0; i<eInput.length; i++) { 
 
\t for (var j=0; j<radionames.length; j++) { 
 
\t \t if (eInput[i]==radionames[j]) { 
 
\t \t checker=true; 
 
\t \t } 
 
\t \t else { 
 
\t \t alert(); 
 
\t \t checker=false; 
 
\t \t } 
 
\t } 
 
} 
 
return checker; 
 

 
}

<form method="post" action="something.php" id="form1" name="form1"> 
 
<div class="que">que 1</div> 
 
<div class="answ"><label><input name="2" value="7" type="radio">Answer 1</label></div> 
 
<div class="answ"><label><input name="2" value="5" type="radio">Answer 2</label></div> 
 
<div class="answ"><label><input name="2" value="8" type="radio">Answer 3</label></div> 
 
<div class="answ"><label><input name="2" value="6" type="radio">Answer 4</label></div> 
 
<div class="que">que 2</div> 
 
<div class="answ"><label><input name="1" value="4" type="radio">Answer 1</label></div> 
 
<div class="answ"><label><input name="1" value="1" type="radio">Answer 2</label></div> 
 
<div class="answ"><label><input name="1" value="2" type="radio">Answer 3</label></div> 
 
<div class="answ"><label><input name="1" value="3" type="radio">Answer 4</label></div> 
 

 
<input class="submit_button" value="Submit the form" onclick="return formCheck('form1');" type="submit"> 
 
</form>

我想創建一個檢查輸入「集團」名稱的數組，並將其與所有輸入組名..其餘的會顯示錯誤（紅色文字，信息，無所謂）。 問題是這段代碼並沒有真正做我能看到的東西，並且顯示了something.php，即使我沒有檢查任何東西... 如果這不是一個好方法，我可以對任何建議。

（我不想使用jQuery，代碼對舊的瀏覽器也運行。）

對不起，我的英語，這不是我的母語& 感謝您的幫助提前！ A.

在第二對於在javascript循環

Answer 1

：

使用這條線：

如果（e提供[I]。價值== radionames [J]）{

代替：如果（e提供[I] == radionames [J]）{

你必須真的得到e提供的價值[I]

Answer 2

您可以使用document.querySelectorAll來獲取所有輸入。您還可以通過傳遞輸入類型來對其進行微調。然後從組單選按鈕

function getCheckedButton() { 
 
    var tempNames = []; 
 
    // get all radio button and loop through it to get it's name. 
 
    // use a tempArray to keep unique names 
 
    var radios = document.querySelectorAll('input').forEach(function(item) { 
 
    // if the name is not present then and only then adding name to the array 
 
    if (tempNames.indexOf(item.name) === -1) { 
 
     tempNames.push(item.name) 
 
    } 
 
    }) 
 
    // now looping through temp array 
 
    for (var i = 0; i < tempNames.length; i++) { 
 
    // using the name to select the radio button group to check if any of radio 
 
    // button in this group is checked or not 
 
    // if not checked then it will give null 
 
    if (document.querySelector('input[name="' + tempNames[i] + '"]:checked') !== null) { 
 
     console.log(document.querySelector('input[name="' + tempNames[i] + '"]:checked').value) 
 
    } else { 
 
     console.log("Radio button of group value " + tempNames[i] + " is unchecked") 
 

 
    } 
 

 
    } 
 
}

<div class="que"> 
 
    que 1</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="2" value="7" type="radio">Answer 1</label> 
 
</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="2" value="5" type="radio">Answer 2</label> 
 
</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="2" value="8" type="radio">Answer 3</label> 
 
</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="2" value="6" type="radio">Answer 4</label> 
 
</div> 
 
<div class="que">que 2</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="1" value="4" type="radio">Answer 1</label> 
 
</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="1" value="1" type="radio">Answer 2</label> 
 
</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="1" value="2" type="radio">Answer 3</label> 
 
</div> 
 
<div class="answ"> 
 
    <label> 
 
    <input name="1" value="3" type="radio">Answer 4</label> 
 
</div> 
 
<button onclick="getCheckedButton()">Get checked buttons</button>