我正在尝试使用jquery的validate插件来验证表单。我想要求用户在组中至少选中一个复选框,以便提交表单。这是我的jQuery代码:

$().ready(function() {
$("#subscribeForm").validate({
   rules:   { list: {required: "#list0:checked"} },
   messages:  { list:  "Please select at least one newsletter"}
 });
 });

这是html形式:
<form action="" method="GET" id="subscribeForm">
<fieldset id="cbgroup">
    <div><input name="list" id="list0" type="checkbox"  value="newsletter0" >zero</div>
    <div><input name="list" id="list1" type="checkbox"  value="newsletter1" >one</div>
    <div><input name="list" id="list2" type="checkbox"  value="newsletter2" >two</div>
</fieldset>
<input name="submit" type="submit"  value="submit">

问题是即使未检查任何内容,表单也将提交。我该如何解决?

最佳答案

下面的脚本可能会让您走上正确的路?

您可以将此html保持不变(尽管我将方法更改为POST):

<form method="POST" id="subscribeForm">
    <fieldset id="cbgroup">
        <div><input name="list" id="list0" type="checkbox"  value="newsletter0" >zero</div>
        <div><input name="list" id="list1" type="checkbox"  value="newsletter1" >one</div>
        <div><input name="list" id="list2" type="checkbox"  value="newsletter2" >two</div>
    </fieldset>
    <input name="submit" type="submit"  value="submit">
</form>

这个JavaScript验证
function onSubmit()
{
    var fields = $("input[name='list']").serializeArray();
    if (fields.length === 0)
    {
        alert('nothing selected');
        // cancel submit
        return false;
    }
    else
    {
        alert(fields.length + " items selected");
    }
}

// register event on form, not submit button
$('#subscribeForm').submit(onSubmit)

你可以找到一个working example of it here

更新(2012年10月)
另外应注意,复选框必须具有“名称”属性,否则它们将不会添加到阵列中。仅具有“id”将不起作用。

更新(2013年5月)
将提交注册信息移到javascript并将提交信息注册到表单上(因为它本来应该是原来的)

更新(2016年6月)
将==更改为===

10-05 20:39
查看更多