提交联系表 7 后如何防止在未输入必填字段的情况下重定向到某个 URL

Posted 2023-03-05

【中文标题】提交联系表 7 后如何防止在未输入必填字段的情况下重定向到某个 URL

【英文标题】：How to prevent redirect to a certain URL after submission of Contact Form 7 without input required fields

【发布时间】：2019-05-30 01:31:48

【问题描述】：

我的目标是在提交联系表 7 后重定向到外部 URL，但前提是所有必填字段都已填写。我每次都会收到重定向，即使所有字段都是空白的。 没有输入的字段被标记为无效，但不会阻止重定向。

<input type="submit" value="Send" class="wpcf7-form-control wpcf7-submit" onclick="window.location.href='https://example.com'" />

【问题讨论】：

您可以定义一个点击函数来检查所有字段是否填写正确。那么你可以重定向。

谢谢阿希什。你知道如何创建这个函数吗？

【参考方案1】：

有一些事件可以帮助您实现您的方案。在您的情况下，应在发送电子邮件后调用事件，以便您可以为此使用 wpcf7mailsent。

在页脚添加以下代码。

  <script type="text/javascript">

    document.addEventListener( 'wpcf7mailsent', function( event ) 
     window.location.href='https://example.com' 
    , false );
  </script>

【讨论】：

谢谢 Dipmala。我尝试使用 DOM 事件，但我的项目中有一个功能。我使用条件字段在选择某些条件时打开某些提交按钮，并且每个提交按钮都有自己的重定向页面。我尝试为每个提交按钮添加 ID-s 以识别它们：document.addEventListener( 'wpcf7submit', function( event ) if ( 'submitbutton_id' == event.detail.contactFormId ) location = 'http://example.com/'; , false ); 但问题是 event.detail.contactFormId 是整个联系表单的 ID，而不仅仅是当前的提交按钮。

然后您可以在添加条件时以这种方式检查，也有一些字段，并且将添加其值，因此为该字段添加条件。并在此基础上添加重定向。

【参考方案2】：

上面的代码是正确的。如果仍然发生重定向，试试这个：

<script type="text/javascript">
document.addEventListener( 'wpcf7mailsent', function( event ) 
 window.location.href='#' 
, true );
</script>