单击后JavaScript函数超时

Timeout JavaScript function after being clicked

本文关键字:超时 函数 JavaScript 单击      更新时间:2023-09-26

我已经用AJAX替换了我网站上的iframe。现在好多了,也快多了。人们可以单击刷新按钮来刷新动态区域。

我使用这个功能:

function djrefresh() {
    $('#dj_status').load('inc/dj_status_frame.php');
    $('#djbanner').load('inc/djbanner.php');
    $('#djknopjes').load('inc/dj_knopjes_frame.php');
    $('#djzegt').load('inc/dj_zegt_frame.php');
    $('#djfooter').load('inc/footer_frame.php');
    $('#berichtenbalkframe').load('inc/berichtenbalk_frame.php');
}

工作非常好,但我的网站需要一次加载很多东西。我希望用户能够点击它一次,并获得30秒的超时。

或者如果你有更好的想法,请告诉我。我不希望用户用我自己的脚本DDOS我的网站。提前谢谢。

更改网站结构可能是的最佳选择,但如果没有更多信息,很难给出任何建议。无论如何,要限制对djrefresh的调用,可以使用debounce函数。UndercoreJS包含该函数,或者您可以自己编写一个

function debounce(func, wait, immediate) {
    var timeout;
    return function() {
        var context = this, args = arguments;
        var later = function() {
            timeout = null;
            if (!immediate) func.apply(context, args);
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) func.apply(context, args);
    };
};

这是从https://davidwalsh.name/javascript-debounce-function(我个人用了很多)
这假设"刷新按钮"是页面上的按钮,而不是浏览器刷新
编辑:如果你的网站上有一个刷新按钮,那么在点击后禁用它30秒会更简单

只需创建一个调用计数,对调用使用回调,如果所有调用的加载都已完成,则允许函数继续。

var djrefresh;
//close values to reduce variable name collision
(function(){
 var locked = false;
 var callcount = 0;
 djrefresh = function() {
  if( locked ) return;
  locked = true;
  $('#dj_status').load('inc/dj_status_frame.php',unlock);
  $('#djbanner').load('inc/djbanner.php',unlock);
  $('#djknopjes').load('inc/dj_knopjes_frame.php',unlock);
  $('#djzegt').load('inc/dj_zegt_frame.php',unlock);
  $('#djfooter').load('inc/footer_frame.php',unlock);
  $('#berichtenbalkframe').load('inc/berichtenbalk_frame.php',unlock);
 }
 function unlock(){
  if( ++callcount == 6 ) locked = false;
 }
})()