联系表格7 on_submit不起作用

Question

我想在表单提交时显示警报。

我加在联系表7插件这个代码为 “其它设置”（4.2.2版）

on_submit： “警报（ '提交'）;”

什么都没有出现。

• 没有在萤火
• 错误，也没有警告在控制台
• 没有错误，也没有警告我想没有使用Javascript冲突，因为联系表7成功地 发送电子邮件
• 我相信表单“提交”，因为我可以看到联系人 表单7表单验证错误

任何想法如何解决或进一步调试此问题？

Answer 1

您有任何链接让我们进一步检查吗？这很难。

但是：“我确信表单是”已提交“，因为我可以看到联系表单7的表单验证错误” - >是服务器验证还是前端验证？也许它不是发送？

所有最优秀的

Answer 2

这是不容易的，以此来猜测没有看到源代码，但我今天感到高兴。

您的表单可以工作吗？ 如果没有，联系表格7的JavaScript可能无法在您的网站上运行。

我会告诉你几个可能的原因。

JavaScript文件未加载

这是我已经看到最近的原因。这是由于你的模板，这是缺少调用排队JavaScript的函数。所需的函数是wp_head（）和wp_footer（），它们分别在header.php和footer.php中，在大多数正确的主题中。

冲突与其他JavaScript

很多插件和主题上传自己的JavaScript。其中一些可能被错误地创建，因此与其他插件冲突。在大多数情况下，当发生这种冲突时，您可以使用Firefox的附件Firebug找到JavaScript错误。

HTML结构是无效

像其他JavaScript，联系表7的JavaScript遍历和操纵HTML的结构。因此，如果原始HTML结构无效，它将无法工作。您可以使用HTML验证程序检查您的HTML是否有效。我建议在这种情况下使用W3C标记验证服务。

我的建议是使用实现你的想法的CF 7默认的方式 - 我们称之为：

“1.最佳选项”。

在WP Dashboard上，转到联系人（CF7）并选择您的表单并转到名为“其他设置”的选项卡。

在那里，你可以添加类似这样的代码：

on_sent_ok: "alert('sent ok');" 
on_submit: "alert('submit');" 

如果设置on_sent_ok:后面是一行JavaScript代码，你可以告诉接触形成的代码时，邮件是应该被执行发送成功。同样，使用on_submit:，您可以告诉在提交表单时应执行的代码，而不管结果如何。

双方的行动，你可以使用各种的JS代码，就像你在你的.js文件将：

on_sent_ok: "some js code here"

你可以用它来调用函数是这样的：

on_sent_ok: "your_function();"

或者写一些代码（这一个重定向到谢谢页）：

on_sent_ok: "document.location='/thank-you-page/';"

2.而另一种选择是使用jQuery来处理它：

联系表7是热衷于放出了一些JavaScript事件的那个泡沫最多的文档对象。在版本4.2中，它们可以在contact-form-7/includes/js/scripts.js中找到。如果你使用jQuery，您可以访问这些事件是这样的：

$(document).on('spam.wpcf7', function() { console.log('submit.wpcf7 was triggered!'); });

$(document).on('invalid.wpcf7', function() { console.log('invalid.wpcf7 was triggered!'); });

$(document).on('mailsent.wpcf7', function() { console.log('mailsent.wpcf7 was triggered!'); });

$(document).on('mailfailed.wpcf7', function() { console.log('mailfailed.wpcf7 was triggered!'); });

编辑：

有些jQuery的选项使用但不知何故弃用，所以如果你enco unter问题，尝试使用例如。 'wpcf7：mailsent'而不是'mailsent.wpcf7'。

相同的格式也适用于其他的选项，实际上所有的选项是所提到的文件中的可观察到的：

可湿性粉剂内容/插件/接触形式-7 /包括/ JS /的script.js

Answer 3

我认为有些东西阻止了你的弹出窗口

尝试使用“的console.log”调试，这样可以消除这是一个潜在的问题：

on_submit:"console.log('Submitted');"