Question

我正在使用在http://jqueryvalidation.org/找到的Jquery验证脚本，我希望它能够设置，所以当您单击按钮（而不是提交按钮！）时，它会检查表单以进行验证。如果出现错误，它会在出现错误的字段旁边显示错误，但也会在表单底部显示一条消息，指出上面有错误需要修复。

我似乎无法得到最底层的信息。我正在尝试使用Jquery Validation所具有的errorContainer，但它似乎不起作用。

HTML：

<form id="myform" method="post">
    <p>
        <label for="emailAddress">Email Address*</label>
        <input id="emailAddress" name="emailAddress" class="Span12 EmailAddress" type="email" data-rule-required="true" data-rule-email="true" data-rule-minlength="5" data-msg-required="Provide an email" data-msg-email="Provide a proper email" data-msg-minlength="Email must be at least 5 characters" />
    </p>
    <p>
        <input id="SendMessage" type="button" value="Send Message" class="Button ButtonLarge" />
        <div class="form-errors">
            <h4>There are errors in your form submission, please see details in the form!</h4>
        </div>
    </p>
</form>

Jquery的：

$(document).ready(function() {
    $('#SendMessage').click(function () {
        $("#myform").valid({
            errorContainer: ".form-errors"
        });
    });
});

我有一个使用此代码的JSFiddle：

http://jsfiddle.net/bluecaret/Qh485/

Answer 1

valid()方法不接受参数，只返回布尔值（link），所以如果你仍想使用valid()，你必须在不同的地方进行方式。

我只是使用if语句并在电子邮件有效或无效时隐藏或显示消息，快速回答了您的问题：

$(document).ready(function() {
    $('#myform').validate({
        //any parameters you want to add
    });
    $('#SendMessage').click(function () {
        if(!($("#myform").valid())){
            $('.form-errors').show();
            return false;
        } else {
            $('.form-errors').hide();
        }      
    });
});

工作fiddle

使用errorContainer进行Jquery验证

1 个答案: