Question

我意识到这不是一个新主题，而且之前已被问过。我已经阅读了各种答案，尽管我在Javascript方面做得越来越好，但我对大多数答案感到困惑。

我要求我的用户给出评级，他们对某个类别和公司进行评级。我希望Javascript验证两组单选按钮都有一个标记的答案，如果可能的话，根据未标记的那个提供单独的警报。

我的代码（省略它们包含的表格）

<form action="blah.php" method="post" onsubmit="return validaterating()"
name="ratings">

<input type="radio" name="categoryrate" value="5">
<input type="radio" name="categoryrate" value="4">
<input type="radio" name="categoryrate" value="3">
<input type="radio" name="categoryrate" value="2">
<input type="radio" name="categoryrate" value="1">

<input type="radio" name="companyrate" value="5">
<input type="radio" name="companyrate" value="4">
<input type="radio" name="companyrate" value="3">
<input type="radio" name="companyrate" value="2">
<input type="radio" name="companyrate" value="1">

</form>

使用Javascript：

function validaterating() {

var rate1 = document.forms.ratings.categoryrate;
var rate2 = document.forms.ratings.companyrate;

function validaterating() {
for (var i=0; i < rate1.length; i++) {
if (rate1[i].checked)
return true;
}
alert("Please rate the category.");
return false;
}

现在，我知道这可以验证我拥有的第一个评级，并且是我觉得对我最有意义的验证设置。但是，我无法得到第二个问题（rate2）来验证。我已经尝试了另一个for循环，使用＆amp;＆amp;运算符，当我试图让第二个验证时它停止工作。在我编写代码时使用代码，这怎么可能？

感谢您的时间。

Answer 1

http://jsfiddle.net/R5M5Y/

HTML

<form onsubmit="return test();" action="blah.php" method="post" name="ratings">
category:
<input type="radio" name="categoryrate" value="5">
<input type="radio" name="categoryrate" value="4">
<input type="radio" name="categoryrate" value="3">
<input type="radio" name="categoryrate" value="2">
<input type="radio" name="categoryrate" value="1">
company:
<input type="radio" name="companyrate" value="5">
<input type="radio" name="companyrate" value="4">
<input type="radio" name="companyrate" value="3">
<input type="radio" name="companyrate" value="2">
<input type="radio" name="companyrate" value="1">
    <input type='submit' />
</form>

的JavaScript

function test(){
  var category = document.getElementsByName("categoryrate");
  var check1 = 0;
  for(i=0;i<category.length;i++){
    if(category[i].checked){
      check1++;
      break;
    }
  }
  var company = document.getElementsByName("companyrate");
  var check2 = 0;
  for(i=0;i<company.length;i++){
    if(company[i].checked){
      check2++;
      break;
    }
  }
  if(check1 && check2){
  }else{
    alert("you must select ratings for both company and category");
    return false;
  }
}

Answer 2

这是用于验证两组单选按钮的所有JavaScript吗？首先，您有两个具有相同名称的功能（验证）。其次，您忘记在末尾添加一个结束括号以关闭包装函数。

你应该做的是设置两个变量，它们都作为布尔标志。然后遍历每组单选按钮以确定是否已选择按钮。如果是这样，请将相应的标志设置为true，否则设置为false。然后在最后，测试两个标志是否都设置为true。如果没有，请抛出警报。

Answer 3

function validaterating（）{

var rate1 = document.forms.ratings.categoryrate;   var rate2 = document.forms.ratings.companyrate;

function validaterating（）{       for（var i = 0; i＆lt; rate1.length; i ++）{           if（rate1 [i] .checked）               返回true;           }           警报（“请评价该类别。”）;       返回false;   }

此代码有很多语法错误。我不确定为什么有两个验证评级功能。我现在要假设你把它们复制错了，你的代码确实有效。

这里的问题是你在rate1中找到一个后返回true。如果您之后有任何代码验证rate2，它将不会被命中，因为该函数已经返回。

一种解决方案可能是创建两个布尔变量categoryChecked，companyChecked，并将它们初始化为false。然后，循环遍历每个i的document.forms.rating.categoryrate [i] .checked，如果其中任何一个为真，则设置categoryChecked = true。对于companyChecked也这样做。

然后，用

结束

return categoryChecked && companyChecked

Answer 4

你可以这样做：

function validaterating() {
 return validateGroup(document.getElementsByName("categoryrate")) && validateGroup(document.getElementsByName("companyrate"))
}

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

Answer 5

function validateForm() {



var radios = document.getElementsByTagName('input');
var value;
var sum_radio=0;
var formValid=0;



for (var c = 0; c < radios.length; c++){
 
 if (radios[c].type =='radio'){
 sum_radio = sum_radio + 1;
 }
}

alert('count radio'+sum_radio);


for (var i = 0; i < radios.length; i++) {

    if (radios[i].type == 'radio' && radios[i].checked) {
        // get value, set checked flag or do whatever you need to
        value = radios[i].value; 
       // alert('value'+value);
   
      alert('good'+formValid);
      formValid = formValid + 1;
       
    }
  
}

if (formValid==sum_radio){
alert('yes');
return true;
}else{
alert('no');
return false
}


}

<form name="form1" action="#" onsubmit="return validateForm()" method="post"> 
    First time visitor?:<br/>
            <label for="s1">Yes</label>
            <input type="radio" id="radio0" name="yesno" value="1"/>
            <br/>
            <label for="s2">No</label>
            <input type="radio" id="radio1" name="yesno1" value="2"/>
            <br/>
            <label for="s2">No</label>
            <input type="radio" id="radio2" name="yesno2" value="2"/>

<br/>
            <label for="s2">No</label>
            <input type="radio" id="radio3" name="yesno3" value="2"/>
            <br/>       

 <label for="s2">No</label>
            <input type="radio" id="radio4" name="yesno4" value="2"/>
            <br/>     
<label for="s2">No</label>
            <input type="radio" id="radio5" name="yesno5" value="2"/>
            <br/>     

    <input type="submit" value="Submit"><br/>
    </form>

javascript验证多个无线电选择

5 个答案:

http://jsfiddle.net/R5M5Y/