小编典典

联系表格7 AJAX回调

ajax

经过一段时间的搜索,无法提供任何文档来概述我想要实现的目标。

我使用的是wordpress和Contact Form
7插件,它们都工作正常,我想要实现的是在表单提交时运行一些特定的javascript,我知道我们可以在附加设置中使用“
on_sent_ok:”,但这只能执行如果表格是实际提交的。

我想做的是在表单未提交确定时执行其他一些JavaScript,这会使用户返回未验证的部分。

我可以使用以下代码在单击表单提交1.7秒后运行,但是这有点草率,好像用户运行的连接速度很慢,这可能会在正确提交表单之前运行。

 $('.wpcf7-submit').click(function() {
setTimeout(function() {
    if ($('.fs1 input,.fs1 textarea').hasClass('wpcf7-not-valid')) {
        $('.pop-up-form').removeClass('pustep2').removeClass('pu-closing');
        $('.form-step').hide();
        $('.fs1').show();

    }
    if ($('.fs2 *').hasClass('wpcf7-not-valid')) {
        alert('error on page 2 - take user back to the area with issues')
    }
}, 1700);
});

AJAX表单完成后,我可以使用任何特定的函数或挂钩来运行JS吗?

谢谢!


阅读 210

收藏
2020-07-26

共1个答案

小编典典

鉴于对此主题的回答多种多样,插件开发者似乎每隔5分钟就会改变主意。当前(2017年第一季度),这是工作方法:

document.addEventListener( 'wpcf7mailsent', function( event ) {
  alert( "Fire!" );
}, false );

有效事件为:

  • wpcf7invalid- 当Ajax表单提交成功完成但由于包含无效输入的字段而未发送邮件时触发。
  • wpcf7spam- 在Ajax表单提交成功完成但由于检测到可能的垃圾邮件活动而未发送邮件时触发。
  • wpcf7mailsent -Ajax表单提交成功完成并且已发送邮件时触发。
  • wpcf7mailfailed- 成功完成Ajax表单提交但发送邮件失败时触发。
  • wpcf7submit —在Ajax表单提交成功完成时触发,无论其他事件如何。

调味料:https : //contactform7.com/dom-
events/

2020-07-26