2016-11-11 70 views
2

當用戶單擊聯繫表單7表單的提交按鈕時,我希望頁面滾動到驗證郵件部分。聯繫表7驗證觸發事件

我的方法:

我使用jQuery on click事件提交按鈕和點擊滾動頁面,驗證消息部分。

我相信這是不正確的。因爲點擊它會滾動到該部分,但消息尚未通過ajax。

那麼,有沒有辦法在聯繫表格7中進行驗證並使用它向下滾動時創建事件。

+0

可以使用的setTimeout的js @MarkWilson –

+0

不會是正確的功能。時間可能會有所不同,以提交表格 –

回答

1

在這種情況下,聯繫表單7觸發器wpcf7:invalid您可以使用此觸發器:

$(window).on('wpcf7:invalid', function() { 
    // let's scroll 
}); 

來源:https://github.com/wp-plugins/contact-form-7/blob/master/includes/js/scripts.js(線:109)

+0

不,不在這裏工作。這些事件觸發器都沒有工作,完全沒有記錄。 –

+0

正如你在上面鏈接109的源代碼(IMO最好的文檔)中看到的那樣,觸發器仍然存在。它應該仍然有效。 –

+0

奇怪 - 我無法得到這種格式的工作。我不得不使用這裏看到的DOM事件:https://contactform7.com/dom-events/。源代碼的文檔與查看打開的宜家盒子的說明相同); –

0

這做這項工作了。如果有人有興趣。

$('.wpcf7-form').ajaxComplete(function(){  
     if($(this).hasClass('invalid') || $(this).hasClass('sent')){ 
      $('.forkit-curtain').animate({ 
       scrollTop: $(".wpcf7-response-output").first().offset().top + 100 
      }, 2000); 
     } 
    }); 
0

鑑於各種反應關於這一主題的插件開發者似乎改變他們的想法如何這應該每5分鐘。目前(2017年第一季度),這是工作方法:

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

而有效的事件有:

  • wpcf7invalid - 當觸發一個Ajax表單提交已完成 成功,但郵件並沒有已發送,因爲有 無效輸入字段。
  • wpcf7spam - 當Ajax表單提交已成功完成 ,但由於檢測到可能的 垃圾郵件活動而未發送時觸發。
  • wpcf7mailsent - Ajax 表單提交成功完成併發送郵件時觸發。
  • wpcf7mailfailed - Ajax表單提交成功完成 時觸發,但發送郵件失敗。
  • wpcf7submit - 當Ajax表單提交已成功完成時,無論 其他事件發生時觸發 。

調料:https://contactform7.com/dom-events/