当用户单击提交按钮时 - 如何在使用 Javascript 激活它之前等待 1 秒？

Question

我正在尝试集成一个 API，它在用户每次单击提交按钮表单时都能正常工作。这是有效的，除了 API 没有时间激活，因为我们被直接重定向到另一个页面。

所以，我正在寻找一种方法，当用户单击按钮时……只有 1 或 2 秒后才会出现重定向。

我试过了:

submitButton.addEventListener("click", function() {
  submitButton.setAttribute("disabled", "disabled");

  // Removes disabling after 2 seconds
  window.setTimeout(function() {
      submitButton.removeAttribute("disabled");
  }, 2000);
},false);

但是正如预期的那样，使用该功能，按钮根本不起作用。从逻辑上讲，我应该在 setTimeout 函数中插入重定向或不重定向用户的函数。

问题是：这是一个来自客户的 prestashop 网站，我不知道这个函数的名称。

如果你有什么想法... 谢谢！

P.S：我正在使用 Google 跟踪代码管理器，但 Jquery 无法正常工作。

Answer 1

首先，无论您最终选择哪种解决方案，event.preventDefault() 都会成为您的朋友。这将阻止触发正常的事件挂钩。

您不仅需要将按钮标记为禁用，还需要阻止点击事件实际执行它应该执行的操作。因此，preventDefault().

以下代码将阻止点击的发生按照这些思路应该可以工作：

(function(){
  // set flag to indicate whether we should wait or actually submit
  var delaySubmit = true;
  // get form el
  var form = document.getElementById('#YourFormId');
  form.addEventListener("submit", function(e) {

    // if we've already waited the 2 seconds, submit
    if( ! delaySubmit )
      return;

    // otherwise, stop the submission
    e.preventDefault();
    // set the flag for next time
    delaySubmit = false;

    // and resubmit in 2 seconds. 
    window.setTimeout(function() {
        this.submit();
    }, 2000);
  });
})();

当用户单击提交按钮时 - 如何在使用 Javascript 激活它之前等待 1 秒？

When a user click on a submit button - How to wait 1 second before activating it with Javascript?

html

javascript

prestashop