1

我正在使用在http://jqueryvalidation.org/上找到的 Jquery Validation 脚本,并且我希望它进行设置,因此当您单击一个按钮(不是提交按钮!)时,它会检查表单以进行验证。如果有错误,它会在有错误的字段旁边显示错误,但还会在表单底部显示一条消息,说明上面有错误需要修复。

我似乎无法让底部消息正常工作。我正在尝试使用 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>

查询:

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

我在这里有一个使用此代码的 JSFiddle:

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

4

1 回答 1

1

valid()方法不接受参数,只返回一个布尔值(链接),所以如果你仍然想使用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();
        }      
    });
});

工作小提琴

于 2013-10-23T21:36:38.280 回答