jQuery Validate：在提交之前验证后删除元素？

Posted 2023-05-08

【中文标题】jQuery Validate：在提交之前验证后删除元素？

【英文标题】：jQuery Validate: Remove element AFTER validation BEFORE submit?

【发布时间】：2018-08-20 20:06:39

【问题描述】：

我有一个城市的 SVG 地图，点击它时，会在我的表单中的 div 中创建隐藏元素。

我正在使用jQuery Validation Plugin 来验证我的表单。

为了确保用户点击了地图的某个区域，我想在普通隐藏元素所在的位置创建一个虚拟隐藏元素，并将验证规则放在上面。我编写了自己的验证规则来检查隐藏元素的数量（表明用户点击了地图上的某处）。这条规则是这样的：

$.validator.methods.zones = function (value, element, param) 
   return ($('#search_form #zone-selectors input').length > 1); // 1 instead of 0 to account for the dummy element
;

<div id="zone-selectors">
  <input type="hidden" name="dummy">
</div>

但是，我不能允许该虚拟元素与表单的其余部分一起提交；我需要在表单经过验证但在提交表单之前将其删除。当然，我想为validate() 使用submitHandler 选项：

// ...
submitHandler: function(form) 
   $(form).find('input[name=dummy]').remove();
   $(form).submit();
,
// ...

...但这似乎创建了一个无限循环，并且我的浏览器使脚本超时。我做错了什么？

【参考方案1】：

submitHandler 需要调整，如下所示：

submitHandler: function(form) 
   $(form).find('input[name=dummy]').remove();
   form.submit();

调用 jQuery .submit() 触发器会再次导致验证，并出现无限循环……您想在此处调用原生 .submit() 函数。

【讨论】：

现在表单根本不提交...？但是，隐藏元素已被删除，所以我知道 submitHandler 正在被调用。

@neezer - 表单有动作吗？还是您尝试通过 ajax 提交？

@nick 它有一个动作。我想要一个普通的提交，而不是 Ajax 提交。

@neezer - 你有指向我可以看到的页面的链接吗？

@nick - 当然，一旦我发布链接，我就无法重现问题。看起来它有效。谢谢。

【参考方案2】：

当上述答案不起作用时，这似乎对我有用。可能与 jQuery 和 jQuery Validation 版本有关。

submitHandler: function(form) 
   $('input[name=dummy]', form).remove();
   form.submit();