验证jQuery触发器转换

我正在使用一些jQuery做一些表单验证。以下是验证脚本。验证jQuery触发器转换

$(document).ready(function() { 

    $('#contact-form').validate({ 

    rules: { 
     cf_name: { 
     minlength: 2, 
     required: true 
     }, 

     cf_email: { 
     required: true, 
     email: true 
     }, 

     phone: { 
     minlength: 10, 
     required: true 
     }, 

     user_pass: { 
     minlength: 2, 
     required: true 
     }, 

     validateSelect: { 
     required: true 
     }, 

     validateCheckbox: { 
     required: true, 
     minlength: 2 
     }, 

     validateRadio: { 
     required: true 
     } 
    }, 

    focusCleanup: false, 
    highlight: function(label) { 
     $(label).closest('.control-group').removeClass('success').addClass('error'); 
    }, 

    success: function(label) { 
     label 

     //.text('OK!').addClass('valid') 
     .closest('.control-group').addClass('success'); 
    }, 

    errorPlacement: function(error, element) { 
     error.appendTo(element.parents('.controls')); 
    } 
    }); 
    $('.form').eq(0).find('input').eq(0).focus(); 
}); // end document.ready

在我的提交按钮，我有这样的代码：

<input type="submit" value="SUBMIT" id="sub" class="sub_text">

我想使它这样，当用户点击提交按钮和表单验证它的任何衰退前/转变，它确实这段代码中：

$("#sub").click(function(){ 

    $("#forms").fadeOut(1000);   
    $("#overlay1").delay(1000).fadeIn(1000);   

});

但我的问题是，如果用户忘记一个区域，然后点击提交，覆盖过渡发生。我希望它仅在验证成功时才会发生。

我怎么才能够触发事件，只有当它被验证？

来源

2016-01-10 MrTechie

对不起，我毁了你的完美千元。 ;-) –

@ some-non-descript-user没关系！我热爱前进。我现在值得更多。谢谢你，以及。 ;） – MrTechie

为什么不只是把过渡成功回调...？ –

你有没有打过电话form.valid()如下：给定形式

$("#sub").click(function(){ 
    if($('#contact-form').valid()){ 
     $("#forms").fadeOut(1000);   
     $("#overlay1").delay(1000).fadeIn(1000); 
    }  
});

.valid()检查是否是有效还是无效。

来源

2016-01-10 19:52:23 vijayP

似乎没有照顾到这个问题。 – MrTechie

哦真的......但根据插件文档'.valid（）'只有在表单完全填充正确的方式时才返回true，我的意思是填充有效信息。 – vijayP

不确定它会工作，因为单击事件将在验证之前触发...所以'if（$（'＃contact-form'）.valid（））{'还没有正确的值 –

您正在使用错误的挂钩。您将您的淡入淡出代码附加到按钮的“单击”事件中，意味着当用户单击按钮时您将执行淡入淡出。

解决方案？很简单，只需看看jqueryvalidation doc（http://jqueryvalidation.org/validate），而不是在按钮的单击事件中淡入淡出，只需在验证钩子中进行即可。

$('#contact-form').validate({ 
    submitHandler: function(form) { 
    $("#forms").fadeOut(1000);   
    $("#overlay1").delay(1000).fadeIn(1000); 
    // do other things for a valid form 
    form.submit(); 
    } 
});

来源

2016-01-10 19:52:58

我相信我其实已经尝试过，但无法让它正常开火。 – MrTechie

验证jQuery触发器转换

回答

相关问题