.wpcf7-mail-sent-ok 时 5000 秒后显示和隐藏 DIV

Question

我制作了一份联系表 7，其中包含自定义的“谢谢！” wpcf7mailsent 之后出现的消息。

我需要它在几秒钟后反转。我当前的代码不起作用：

addEventListener('wpcf7mailsent', function(event) {
    event.preventDefault();
    document.querySelector('.qtWRP').style.display = 'none';
    document.querySelector('.inputBTMx').style.display = 'none';
    document.querySelector('.cap').style.display = 'none';
    document.querySelector('.qtWRP2').style.display = 'block';
});

wpcf7Elm.addEventListener( 'wpcf7-mail-sent-ok', function( event ) {
jQuery ( 'form.wpcf7form' )[1000].reset();
}, false );;

感谢任何帮助。

Answer 1

在事件侦听器末尾使用

setTimeout()

来反转所有

.style.display

更改。

addEventListener('wpcf7mailsent', function(event) {
  event.preventDefault();
  document.querySelector('.qtWRP').style.display = 'none';
  document.querySelector('.inputBTMx').style.display = 'none';
  document.querySelector('.cap').style.display = 'none';
  document.querySelector('.qtWRP2').style.display = 'block';
  setTimeout(function() {
    document.querySelector('.qtWRP').style.display = 'block';
    document.querySelector('.inputBTMx').style.display = 'block';
    document.querySelector('.cap').style.display = 'block';
    document.querySelector('.qtWRP2').style.display = 'none';
  }, 5000000);
});