防止单击表单上的提交传播到单击处理程序答案

【问题标题】：Prevent clicking submit on form from propagating to click handler防止单击表单上的提交传播到单击处理程序
【发布时间】：2014-08-15 00:40:54
【问题描述】：

我有一个单击事件，可以将表单向上滑动到视图中。我还使用 .toggle 将表单向下滑动。我遇到的问题是，当用户单击表单上的提交按钮时，表单会向下滑动，就像触发了 .toggle 一样。

// Slides the contact form up from the footer
$('#show-form').click(function (e) {
e.stopPropagation();
$('#get-started-form').hide('slide', {direction: 'down'}, 750);
$(this).next('#get-started-form').stop().toggle('slide', {direction: 'down'}, 750);

});

我尝试在表单的提交按钮上使用 .stopPropogation，如下所示；

$('#gform_submit_button_1').click(function(event) {
event.stopPropagation();

});

【问题讨论】：

可能重复：stackoverflow.com/questions/9065972/jquery-trap-form-submit
什么是html？你可以发送一个jsfiddle或codepen吗？似乎按钮单击也作为表单单击传播，但如果没有看到您在脚本中引用的 hmtl 结构，则无法确定。
jsfiddle.net/xbztkbxx/8 单击#show-form 会使重力表单向上滑入查看。当点击提交按钮时，触发事件被触发并且表单滑回视图之外。它应该保持打开状态，直到再次单击#show-form，以便用户可以看到确认或验证错误。 *我看到 Gravity 表单正在向文档中添加一个触发事件，这可能是导致问题的原因。 *有关我试图用来防止重力表单触发器影响切换的代码，请参阅 javascript。 *使用jQuery UI上下滑动。

标签： jquery forms click submit event-bubbling

【解决方案1】：

看起来页面在提交时正在重新加载，并且没有显示验证消息，因为页面重新加载时它“关闭”或加载关闭。尝试通过 ajax 而不是表单 post 进行验证和提交。

【讨论】：