Question

如果我想在第一次（onclick）立即运行功能怎么办但后来我想在每次onclick运行之前将超时设置为3秒？有什么想法吗？

function FetchData() {
}

编辑：@epascarello代码完全符合我的要求。

BTW是否有任何方法可以在单击按钮时删除“旧”消息但不删除所有div内容 - 只有通过此onclick功能添加的内容（旧的，因此只会出现最新消息）？

Answer 1

您可以使用h之类的东西作为处理程序：

function h(){
  //
  // do Your code
  //
  h.to = h.to ?
    clearTimeout(h.to)
    :
    setTimeout(h, 3000);
}

https://jsfiddle.net/vfLo4htd/

Answer 2

你可以有一个标志来检查它是否是第一次点击。积分@epascarello

var timeout = null;
var firstClick = false;

function notify() {
  console.log("Hello World!");
}

function clickHandler() {
  if(!firstClick){
    firstClick = true;
    notify();
    return true;
  }
  
  if (timeout) {
    resetTimeout();
  } 
  initTimeout();
}

function initTimeout() {
  timeout = setTimeout(notify, 3000);
}

function resetTimeout() {
  window.clearTimeout(timeout);
  timeout = null
}

<button onclick="clickHandler()">Click me!!!</button>

Answer 3

所以听一下第一次点击并调用该函数，然后翻转一个布尔值并设置延迟。

(function(){

  var _first = true,
      timer;
  
  function FetchData() {
      var delay = _first ? 0 : 3000;
      if (timer) window.clearTimeout(timer);
      timer = window.setTimeout(_runFetch, delay);
      _first = false;
  }

  /* Or you can do if a few microseconds matter
  function FetchData() {
      if (_first) {
          _runFetch() 
          _first = false;
      } else {
          if (timer) window.clearTimeout(timer);
          timer = window.setTimeout(_runFetch, 3000);
      }
  }

  */
      
  function _runFetch() {
      var out = document.getElementById("out");
      out.innerHTML = (new Date()) + "<br/>" + out.innerHTML;
  }
  
  
  document.getElementById("btn").addEventListener("click", FetchData);
  
}());

<button id="btn">Click</button>
<div id="out"></div>

Answer 4

试试这个：

var first = true;

function FetchData() {
    if(first) {
       //magic
       first = false;
    } else {
       window.setTimeout(function() {
         //magic
       }, 3000);
    }
}

Javascript：在特定时间段后再次调用函数

4 个答案: