Question

如果尚未创建表单，如何使用此代码（来自demo）：

jQuery("#form").validate({
  submitHandler: function(form) {
    jQuery(form).ajaxSubmit({
      target: "#result"
    });
  }
});

一种不起作用的方法是在on('click',上调用验证：

$(document.body).on('click', '.submitBtn', function(){
   var $form =$('form'+this.id);
       $form.validate({
         submitHandler: function($form) {
           $form.ajaxSubmit({
             target: "#result"
           });
         }
       });
});

有什么建议吗？

Answer 1

创建表单后尝试使用jQuery("#form").validate().form()。 http://docs.jquery.com/Plugins/Validation/Validator/form

$(document.body).on('click', '.submitBtn', function(){
   var $form =$('#form'+this.id);
       $form.validate({
         submitHandler: function($form) {
           $($form).ajaxSubmit({  //need to properly refer to jQuery object
             target: "#result"
           });
         }
       }).form();
});

Answer 2

我认为对类似问题的回答可以帮助你解决很多问题https://stackoverflow.com/a/4359915/351366

以下是让您的代码更具针对性的一个镜头

创建一个自定义事件，一旦表单出现在页面上就会触发

$(document).bind('bindForm', function (e) {
    jQuery("#form").validate({
        submitHandler: function(form) {
          jQuery(form).ajaxSubmit({
             target: "#result"
          });
        }
    });
});

然后在加载表单时，触发自定义事件

$(document).trigger('bindForm'); //trigger our validate form

如果您想检查您的表单在其他功能中是否有效

$(".submitBtn").live("click",function() {
    if (!$("#form").validate().form()) {
        return;
    }
});

jquery使用动态表单验证插件

2 个答案: