JQuery 验证错误消息不合适答案

【问题标题】：JQuery Validate error messages out of placeJQuery 验证错误消息不合适
【发布时间】：2014-01-22 01:17:30
【问题描述】：

我有一个正在使用 Jquery Validate 进行验证的表单。该表单包含 2 个具有相同名称的复选框，其中至少一个必须被选中。为此，我在复选框名称上使用 .validate() 以及规则：required"。

虽然我能够成功验证（即当未选中复选框时弹出错误消息），但错误消息显示在第一个复选框之后，这会破坏我的格式。

我目前正在使用 errorElement 和 errorPlacement 使错误消息显示在每个输入元素之后的一对 span 标签中，但它似乎不适用于复选框。

HTML（提取）：

<form id='BizAddItem' name='BizAddItem' method='post' action='additemprocess.php' enctype='multipart/form-data' novalidate='novalidate'>

        //More input elements above

        <div class='BizAddItemDetails'>
            <label for='BizFulfilment'>Order Fulfilment:</label>
            <input type='checkbox' id='BizFulfilment' name='BizFulfilment[]'>Delivery &nbsp
            <input type='checkbox' id='BizFulfilment' name='BizFulfilment[]'>In-Store Pickup
            <span></span>
        </div>
        //More input elements below

</form>

jQuery 代码（摘录）：

$('#BizAddItem').validate({

    errorElement:"span",
    errorPlacement:function(error,element){

        error.insertAfter(element);

    },

    rules:{

        //More items above

        'BizFulfilment[]':{

            required:true
        },

    },

    messages:{

        //More items above

        'BizFulfilment[]':{

            required:"Please select at least one option"
        },
    },

        submitHandler:function(form){

        form.submit();

        }

})

提供的任何帮助将不胜感激。谢谢！

【问题讨论】：

标签： javascript jquery html validation checkbox

【解决方案1】：

试试这个....

 errorPlacement:function(error, element)
        {
            if($(element).attr("name")=="BizFulfilment[]")
            {
                $(element).parent().append(error);
            }else
            {
            $(error).insertAfter(element);
            }   
        },

【讨论】：

如果我正确理解了您的代码，您检查复选框（BizFuliflment）的错误，然后将错误消息附加到父级（在这种情况下包含 div）？如果是这样，为什么 insertAfter 不适用于复选框？
insertAfter 表示在第一个复选框之后。（在两个复选框之间）。所以使用 $(element).parent().append(error);