使用Jquery验证单选按钮集

时间:2013-05-04 12:21:49

标签: jquery html validation

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

例如:

<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”应该有一个选定的单选按钮,并在任何一种情况下获得适当的消息。

3 个答案:

答案 0 :(得分:2)

你应该自己尝试......

无论如何,这是一个例子:

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/

答案 1 :(得分:0)

您可以尝试这样的事情:

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,类似于我在代码中提到的类。

答案 2 :(得分:0)

如果您只有单选按钮:

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

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