如何在不保留字段规则的情况下克隆字段集？
我克隆了我的fieldset，它完美无缺。 我完全清楚所有领域的价值。 我遇到的唯一问题是，如果在添加新字段集之前提交已提交，则遵循规则，如果您没有点击提交，则遵循规则。 我真正想要的是能够删除所有规则并重新设置或保持规则正常工作。 我试图删除规则，它没有工作（）。 我尝试添加新规则，它可以工作，但每次添加一个部分时，每个字段还有1个规则。 请注意，每次添加新字段集时，我的ID和名称都会更改。
这是我的html @Sparky：
检查我的Jquery，任何帮助将不胜感激：
$(document).ready(function(){ $("#excavationform").validate({ rules: { compName: { required: true }, compCity: { required: true, }, compAddress: { required: true }, compPROV: { required: true }, compPostCod:{ required:true } }, messages: { compName: "Enter the company name.", compAddress: "Enter the company's address", compCity: "Enter the company city", compPROV: "Enter the company province", compPostCod:{ postalcode: "Enter a valid postal code in the format A1A 1A1 (including the space).", required: "A valid postal code is required" } } }); nameFields("#compName"); nameFields("#compAddress"); nameFields("#compCity"); filterInvalidHHTPPostChar("#compAddress"); filterInvalidHHTPPostChar("#compPostCod"); makeCaps("#compPostCod"); ////////////////////////////////////////////////////////////////////////////// ////////////////////////////////////////////////////////////////////////////////////////////////////////////// }); $(function () { $("form").on("click","#addSection",function (e) { e.preventDefault(); var num = $('.clonableId').length, // how many "duplicatable" input fields we currently have newNum = new Number(num + 1), // the numeric ID of the new input field being added newElem = $('#location' + num).clone(true).attr('id', 'location' + newNum).fadeIn('slow'); // create the new element via clone(), and manipulate it's ID using newNum value // manipulate the name/id values of the input inside the new element // Property Owner - Input newElem.find('#lblOwner' + num).attr('id', 'lblOwner'+ newNum).attr('for', 'propertyOwner'+ newNum); newElem.find('#propertyOwner' + num).attr('id', 'propertyOwner'+ newNum).attr('name', 'propertyOwner'+ newNum).val(''); // Excavation Address - Input newElem.find('#lblexcavAddress' + num).attr('id', 'lblexcavAddress' + newNum).attr('for', 'excavAddress' + newNum); newElem.find('#excavAddress' + num).attr('id', 'excavAddress' + newNum).attr('name', 'excavAddress' + newNum).val(''); // Excavation City - Input newElem.find('#lblexcavCity' + num).attr('id', 'lblexcavCity' + newNum).attr('for', 'excavCity' + newNum); newElem.find('#excavCity' + num).attr('id', 'excavCity' + newNum).attr('name', 'excavCity' + newNum).val(''); // Excavation Province - Input newElem.find('#lblexcavProv' + num).attr('id', 'lblexcavProv' + newNum).attr('for', 'excavProv' + newNum); newElem.find('#excavProv' + num).attr('id', 'excavProv' + newNum).attr('name', 'excavProv' + newNum).val(''); // Excavation Postal Code - Input newElem.find('#lblzipCode' + num).attr('id', 'lblzipCode' + newNum).attr('for', 'excavPostCod' + newNum); newElem.find('#excavPostCod' + num).attr('id', 'excavPostCod' + newNum).attr('name', 'excavPostCod' + newNum).val(''); // insert the new element after the last "duplicatable" input field $('#location' + num).after(newElem); // Allow the datepicker: we delete it first then we re-create it $('#location' + newNum).on('focus','.dateChooser', function(){ $(this).removeClass('hasDatepicker').datepicker(); }); // focus on the first input of the new section $('#propertyOwner' + newNum).focus(); ///////////////////////////////////////////////////////Add rules //////////////////////////////////////////////////Control on the new section nameFields("#propertyOwner" + newNum); nameFields("#excavAddress" + newNum); nameFields("#excavCity" + newNum); numberFields("#MBrfNumber" + newNum); nameFields("#supervisorName" + newNum); fieldLength("#propertyOwner" + newNum, 70); fieldLength("#excavAddress" + newNum, 70); fieldLength("#excavCity" + newNum, 35); fieldLength("#excavPostCod" + newNum, 7); fieldLength("#startDate" + newNum, 10); fieldLength("#endDate" + newNum, 10); fieldLength("#MBrfNumber" + newNum, 10); fieldLength("#supervisorName" + newNum , 70); /////////////////////////////////////////Dates // enable the "remove" button $('#btnDel').attr('disabled', false); }); $('#btnDel').click(function () { // confirmation if (confirm("Are you sure you wish to remove this section? This cannot be undone.")) { var num = $('.clonableId').length; // how many "duplicatable" input fields we currently have $('#location' + num).slideUp('slow', function () {$(this).remove(); // if only one element remains, disable the "remove" button if (num -1 === 1) $('#btnDel').attr('disabled', true); // enable the "add" button $('#addSection').attr('disabled', false).prop('value', "add section");}); } return false; // remove the last element // enable the "add" button $('#addSection').attr('disabled', false); }); });
在几个地方你有class="required" ，这将是你的输入元素内部的问题。 但是，你的元素中有这个class ，所以我们可以排除它。
jQuery Validate需要在每个输入上都有唯一的name属性，所以即使你不小心重复了这些名称，jQuery Validate也只能在每个元素的第一个实例上工作，而不能在克隆上工作……如果该元素在.validate()时不存在.validate()被调用，你可以完全排除.validate()方法作为原因。
在调用.validate()之后，在动态创建的元素上声明规则的唯一方法如下……
-
使用
.rules('add')方法 （虽然为什么你要添加你说你不想要的规则，我在你的代码中看不到这个） -
使用内联HTML 5validation属性，例如
required="required"。 （我在你的代码中没有看到这些） -
使用内联
class声明，例如class="required"。 （再次，你只是在元素上这样做）
换句话说，我在代码中看不到任何会导致任何validation规则进入动态创建或克隆元素的内容。 你要么忽略了向我们展示导致问题的代码，要么你误解了你所看到的。
使用浏览器的开发人员工具检查DOM，并validation克隆的标记是否符合您的预期，并且您没有上述＃2和＃3中所述的任何属性或类。
如果你已经尝试过.rules('remove')并且它失败了， 根据文档 ，这个方法“……只操纵通过rules-option或rules('add')指定的规则” 。 换句话说，您只能使用.rules('remove')来删除.rules('add') .validate()或.rules('add')方法所实施的规则。
请记住.rules('remove')只能附加到表示单个输入元素的选择器…
$('#singleInput').rules('remove'); // <- ONE input
否则，如果您的选择器以一组元素为目标，则需要将其包装在jQuery .each() ...
$('.groupOfInputs').each(function() { // <- multiple inputs $(this).rules('remove'); });
编辑 ：
根据评论中发布的jsFiddle ，您可以看到实际发生的情况。
从原始部分克隆规则没有问题，而您的问题实际上与规则完全无关。 问题是您正在克隆错误消息本身...错误消息仅适用于原始元素集。 你真的需要重新思考你的整个方法，因为我甚至不了解在这里克隆任何东西的优势。
由于您已经竭尽全力重命名所有内容，只需使用jQuery为每个部分编写所有新标记，而不是盲目地克隆包含动态内容的内容，例如您甚至不需要/不需要的错误消息。 换句话说，只需使用新名称创建新表单元素，而不是从其他地方创建，克隆或复制任何动态内容。 您的代码实际上将变得简化，因为在首先正确创建DOM时，您不必进行如此多的DOM操作。