Question

我已经尝试了一切我能想到的使用Javascript和/或JQuery来验证这些单选按钮。什么都行不通。这是我的表格：

foo.getLocations(textField.text!)

我不知道问题是我最终有多个具有相同ID的输入，或者因为我使用的是HtmlHelper表单。我尝试了很多Stack Overflow解决方案，包括从内联javascript到使用for循环的所有内容，但没有任何效果。例如，使用我当前的尝试：

@using (Html.BeginForm("NextPage", "AccountsFinance", FormMethod.Post))
{
<div class="row Question">
    <h2>@Model.Question</h2>
</div>
<div class="row">
    <table cellspacing="10">
        <tr>
            @foreach (string answer in Model.Answers)
            {
                <td><input id="rad" type="radio" name="answer" value="@answer" /><span>@answer</span></td>
            }
        </tr>
    </table>
</div>
<div class="row footerButtons">
    <div class="col-md-5 col-sm-5">&nbsp;</div>
    <div class="col-md-1 col-sm-1">
        <input class="btn btn-success" type="submit" name="Previous" value="Back" />
    </div>
    <div class="col-md-1 col-sm-1">
        <input class="btn btn-success" type="submit" name="NextPage" value="Next" />
    </div>
    <div class="col-md-5 col-sm-5">&nbsp;</div>
</div>a
}

无论是否单击单选按钮都无关紧要，我总是会出现function myFunction() { var chx = document.getElementsByTagName('input'); for (var i = 0; i < chx.length; i++) { if (chx[i].type == 'radio' && !chx[i].checked) { alert("nope"); return false; } else { return true; } } };。出了什么问题？提前谢谢！

Answer 1

首先，不要多次使用相同的ID，这会使您的HTML无效！

如果您想检查是否只检查了一个，您可以在几行中完成此操作

function myFunction() {
  if ($('input[name="answer"]:checked').length === 1)
  {
     console.log('only one checked');
  }
};

或没有记录

function myFunction() {
  return $('input[name="answer"]:checked').length === 1;
};

仅供参考，如果它们都具有相同的名称并且是无线电广播，则无论如何您最多只能查看一个。所以没有必要检查＆gt; 1

Answer 2

您不应该使用id属性，因为您将在页面上结束使用它们。
使用$("input[type='radio']")从页面获取所有无线电输入
将获取的结果存储在数组上，然后通过它迭代并查看是否已选中
您可以从第3点进一步自定义Jquery，只获取未选中或选中的单选按钮。

示例：

function myFunction() {
    var radios = $("input[type='radio']");
    for( i = 0; i < radios.length; i++ ) {
        if( radios[i].checked ) {
            return true
        } else {
          return false;
         }

    }
    return null;
}

Answer 3

你可以使用下面的jQuery代码来验证单选按钮，你的html没有任何问题。只需使用以下代码。

$(function(){
    if($("input:radio:checked").length() <= 0){
       alert('Nope')
    }
    else{
       alert('Yup')
    }
})

如何验证是否已选择这些单选按钮中的至少一个？

3 个答案: