jQuery只在SUBMIT验证规则

Mic*_*ael 27 jquery jquery-validate

假设我有一个查找城市,州位置的表单.如果用户输入了错误的城市,状态,我希望表单能够根据用户输入检查数据库,并查看输入是否有效.如果不是,我希望用户提示.

因此,表单Validate是我的插件.

$("#form").validate({
    rules: {
       citystate: {
           required: true,
           myCustomAjaxSyncronousCheckAgainstDBRule: true
       }

    submitHandler: function(form) {
        if ($("#form").valid()) {
            form.submit();
        }
    }
});
Run Code Online (Sandbox Code Playgroud)

现在说这个表单必须在我的网站的4个不同的地方使用,所以很难重构myCustomAjaxSyncronousCheckAgainsDBRule(伪名称btw)并在我的网站上有4次相同的代码.这就是我在JS文件中创建自定义规则的原因.但有没有办法只能在提交时检查规则.因为如果用户输入无效,它将在每次击键时检查它,这可能非常麻烦.特别是因为我有jQuery.ui.autocomplete运行unjuction.

iiv*_*vel 34

所有验证都可以单独设置(onclick,onkeypress,onsubmit等).

有关演示和详细信息,请访问docs网站 http://docs.jquery.com/Plugins/Validation/validate


$("#form").validate({
   onkeyup: false,
   onclick: false
})

  • 如果我们只想要一条规则进行非onkeyup验证怎么办?或者点击.但其余的都没问题.通过这个,我的意思是只有提交检查的众多输入之一. (5认同)

sab*_*ero 10

作为替换,一个更简单的方法,你可以传递一个函数的onfocusoutonkeyup的jquery.validator的设置来决定是否一个元素在这些事件或不被确认,因为这样:

jQuery.validator.defaults.onfocusout = function (element, event) {
    // detectect if is the element you dont want validate
    // the element has to have the attribute 'data-control="mycitycontrol"'
    // you can also identify your element as you please
    if ($(element).data("control") === "mycitycontrol") return;
    if (!this.checkable(element) && (element.name in this.submitted || !this.optional(element))) {
        this.element(element);
    }
}
jQuery.validator.defaults.onkeyup = function (element, event) {
    // detectect if is the element you dont want validate
    // the element has to have the attribute 'data-control="mycitycontrol"'
    // you can also identify your element as you please
    if ($(element).data("control") === "mycitycontrol") return;
    if (event.which === 9 && this.elementValue(element) === "") {
        return;
    } 
    else if (element.name in this.submitted || element === this.lastElement) {
        this.element(element);
    }
}
Run Code Online (Sandbox Code Playgroud)

  • 另一种完成此任务的方法:$("#myfield").on("focusout keyup",function(e){e.stopPropagation();}); (3认同)

Rod*_*nho 9

$.extend($("#form-id").validate().settings, { 
    onkeyup: false, 
    onfocusout: false 
});
Run Code Online (Sandbox Code Playgroud)


Ryl*_*ley 6

这是一个可能有用的想法:单独绑定您不希望验证keyup事件的字段的keyup函数,并让它不起泡:

$('#citystateID').bind('keyup',function(){
   return false; 
});
Run Code Online (Sandbox Code Playgroud)

我无法弄清楚如何绑定验证器特定事件(focusin和focusout),所以当焦点离开你的"citystate"输入时它仍会运行验证,但它更接近你想要的?

我在这里简单测试了一下:http://jsfiddle.net/svUdp/ 似乎工作正常(看着你的控制台看看会发生什么 - 很多事件被触发,但没有那么多验证).


小智 6

如果您尝试获取特定的验证方法仅在提交事件上触发,同时允许其他验证方法正常触发(例如,在onkeyup事件上),那么您可以在提交事件触发时动态添加规则,然后删除在执行验证后.绑定的顺序很重要; 保持秩序.

$('#form').bind('submit', function(event) {
    $('#citystate').rules('add', {myCustomAjaxSyncronousCheckAgainstDBRule: true});
    event.preventDefault();
});

$('#form').validate({
    rules: {
        citystate: { required: true }
    }
});

$('#form').bind('submit', function(event) {
    $('#citystate').rules('remove', 'myCustomAjaxSyncronousCheckAgainstDBRule');
    event.preventDefault();
});
Run Code Online (Sandbox Code Playgroud)


小智 6

$("#form").validate({ onfocusout: false, onkeyup: false, onclick: false });