Javascript 使用jQuery验证程序验证动态生成的表单

Javascript 使用jQuery验证程序验证动态生成的表单,javascript,jquery,jquery-validate,Javascript,Jquery,Jquery Validate,很抱歉一直问这个问题,但我就是想不出来。我已把这个问题降到最低限度 如何验证动态生成的表单?下面是我的尝试,但正如所见,它显示为通过验证 按钮需要位于表单内部,并且是type=submit,以便插件捕获点击 不要将.validate放入单击处理程序中,请参见第1项。它只用于初始化表单上的插件。例外情况,下面我们在单击处理程序中创建新表单,然后立即在新表单上调用.validate 通过这两个小的更改,静态表单上的验证工作正常: 为了清晰起见,我重写了DOM操作代码。我只是复制了表单的HTML并给它

很抱歉一直问这个问题,但我就是想不出来。我已把这个问题降到最低限度

如何验证动态生成的表单?下面是我的尝试,但正如所见,它显示为通过验证

按钮需要位于表单内部,并且是type=submit,以便插件捕获点击

不要将.validate放入单击处理程序中,请参见第1项。它只用于初始化表单上的插件。例外情况,下面我们在单击处理程序中创建新表单,然后立即在新表单上调用.validate

通过这两个小的更改,静态表单上的验证工作正常:

为了清晰起见,我重写了DOM操作代码。我只是复制了表单的HTML并给它一个新ID:
错误1。。。将.validate放入单击处理程序中。我也不明白为什么要在第一个窗体的单击处理程序中创建另一个窗体。@Sparky。因为表单在页面加载时不存在。我同意关于$'myForm'的部分。validatemyValidateObj;没有道理,但只是作为一个例子。请参阅和了解一些历史。谢谢你的帮助!我回答了第一个问题,而你不再回答我了。我只能在每一个具体问题中讨论这些问题。我不能期望看到别人的几个不同的问题,然后把整个项目放在一起。尽管如此,我也愿意在这里发布一个答案,但它只会解决这个特定问题中的具体问题。Sparky!非常感谢。对不起,我有一天的工作,刚回来。对于不同的问题,我也很抱歉,但是我认为它们是不同的,但是可能会让事情变得混乱。我同意这个问题的答案。“非常感谢。”斯帕克还说,意图的澄清。我定义了一些jQuery验证器规则,但只想在一个位置这样做以保持一致性。首先,然后在传统形式上使用。完美的然后希望在内联编辑中使用相同的规则。再次感谢!!!哇,真奇怪。我甚至没有看到你的答案,当我把一条评论回复给你的时候。你的方法似乎确实符合我的要求。不知道它是否能满足我的目标,还需要测试。谢谢你的帮助。
<form id="myForm">
    <input type="text" name="email" id="email" value="bademail" >
</form>
<button id="validate">validate</button>

var myValidateObj = {
     rules: {
         email: {
             email: true
         }
     }
 };

 $(function () {

     jQuery.validator.setDefaults({
         debug: true,
         success: "valid"
     });

     $('#validate').click(function () {

         //Validate the traditional form
         var validate1 = $('#myForm').validate(myValidateObj);
         console.log('Option 1', $('#myForm'), $('#email'), $('#email').val(), validate1.element('#email'), $('#email').valid(), $('#myForm').valid());

         //Validate dynamically created form
         var input = $('<input />', {
             type: 'text',
             name: 'email',
             value: 'bademail'
         });
         //input.prop('value', 'bademail');
         var form = $('<form />').append(input);
         var validate = form.validate(myValidateObj);
         console.log('Option 2', form, input, $('#email').val(), validate.element(input), input.valid(), form.valid());
     });

 });
$(function () {

     // INITIALIZE plugin on the traditional form
     var validate1 = $('#myForm').validate(myValidateObj);

     $('#newform').one('click', function () {

         // code here to create new form; give it new ID
         // do not duplicate ID on anything else

         // INITIALIZE plugin on the new form
         var validate = $('#myForm2').validate(myValidateObj);
     });

});