jquery - 使用 Jquery 验证单选按钮集

Question

如何验证一组具有不同名称属性的单选按钮。

例如：

<div id="divTest">
     <ul>
          <li><input type="radio" name="rdo0"><span>Good</span></li>
          <li><input type="radio" name="rdo0"><span>Average</span></li>
          <li><input type="radio" name="rdo0"><span>Bad</span></li>
    </ul>

    <ul>
          <li><input type="radio" name="rdo1"><span>Test</span></li>
          <li><input type="radio" name="rdo1"><span>Test 2</span></li>
          <li><input type="radio" name="rdo1"><span>Test 3</span></li>
    </ul>

</div>

我想验证每个“ul”都应该有一个选定的单选按钮，并在任何一种情况下都得到适当的消息。

Answer 1

你应该自己试试...

无论如何，这是一个例子：

function validate_checkbox() {
    var error = false;
    $('ul', '#divTest').each(function() {
        if ( $('input[type="radio"]:checked', this).length == 0) {
            error = true;
        }
    });    
    return error;
}

$("#somebutton").on('click', function() {
        alert(validate_checkbox() ? 'error' : 'ok');
});

http://jsfiddle.net/yiernehr/mgjwj/3/

Answer 2

你可以尝试这样的事情：

var radioChecked = false;
$("ul.ContainsRadios").each(function(ind,ele){
    radioChecked = false;
    $(ele).children("input[type=radio]").each(function(ind2,ele2) {
        if (ele2.checked){
             radioChecked = true;
        }
    });
    if(!radioChecked){
       $(ele).addClass("ValidatClass");
    }
});

上面代码的唯一问题是您需要标记包含无线电输入的 UL，类似于我在代码中提到的类。

Answer 3

如果您只有单选按钮：

var $uls = $('#divTest > ul');
if ($uls.find(':checked').length === $uls.length) {
   // is valid

如果您还有其他输入，那么它是.find(':radio:checked')