用JavaScript添加“延迟”功能

我一直在浏览很多类似的问题，而没有得到我所需要的东西。用JavaScript添加“延迟”功能

我有一些代码，每次发生window.onresize事件时执行。但是代码很困难，通常在短时间内有很多.onresize事件，并且坦白地说，需要执行的代码只能运行一次。

所以我想要的是一些代码等待一段时间，而resize事件继续，然后触发一次（直到触发新的调整大小事件）。

我已经尝试了setInterval和setTimeout，但我发现这些方法只是等待我指定的时间量，然后运行代码的次数与窗口调整大小的次数完全一样（每隔几个像素一次窗口被调整大小）。一遍又一遍地重复相同的代码会将浏览器锁定3-4秒，所以我想在调整大小的时候锁定浏览器并执行代码会更好。

正在执行的代码确保显示在屏幕上的内容显示在它所属的位置。它有很多样式，非常类似于CSS，但是相对于内部窗口大小，JavaScript动态地完成。

Plz，没有jQuery解决方案。

我希望我已经足够具体，并且我能理解你的回复。我只从事编程业务3个月，而且我没有接受过真正的教育，所以我只知道到目前为止，什么样的人生教育我。因此，请详细解释您如何建议您的代码应该被使用。

这是一个小事情正在发生。

window.onresize = function(){resize()};

...

function resize() 
{ 
... 
var CL = document.getElementById("centerleft"); 
CL.style.position = "absolute"; 
CL.style.overflow = "auto"; 
CL.style.top = quaterCONSTANT+"px"; 
CL.style.left = "0px"; 
CL.style.width = CONSTANT+"px"; 
if (getWidth("menu") > CONSTANT) 
    TL.style.width = getWidth("menu")+"px"; 
CL.style.height = h+"px"; 
CL.style.backgroundColor = "#E6E6E6"; 
... 
}

常数和quaterCONSTANT是常数和的getWidth（ID）是一个函数来获取我问于元素的宽度，在这种情况下是宽度我的菜单位于我网页的左侧中央。

现在我每次调整大小时都会发生很多事情。我知道我应该拿出一些东西，比如不要一遍又一遍地将颜色设置成相同的颜色。这应该设置一次，但随着项目的发展，这种情况就随之而来。这不是我的初衷，要实现调整大小功能。

莫尔

来源

2013-08-06 Molle

你需要做的是设置一个变量的调整大小的监听器之外，然后在那里创建超时什么。

var resizeTimeout = 0; 

window.onresize = function() { 
    // Clear our previously-scheduled resize if any (no-op if it's 0) 
    clearTimeout(resizeTimeout); 

    // Schedule to resize in X milliseconds 
    resizeTimeout = setTimeout(function() { 
     // Clear our timer handle and do the resize 
     resizeTimeout = 0; 
     resize(); 
    }, timeout); // `timeout` is in milliseconds, so for instance, 100 
};

当您调整大小直到您停止，此时超时将完成并激活您的功能，这将继续重新分配超时。

来源

2013-08-06 09:24:09

您是不是也想清除每个resize事件的超时时间？否则，它根本没有任何帮助，所有的事件仍然会发生 - 只是晚了。 –

“我只从事编程业务3个月，而且我没有接受过真正的教育，所以我只知道到目前为止，什么样的学校教给我，所以请详细解释你是如何建议你的代码应该被使用的。“ 你可以解释一下更多关于在哪里放置什么样的代码？我相信你是正确的关于清除超时问题。我在想，如果我能理解如何，这可能是答案:) – Molle

在哪里声明0是无效的超时ID？在哪里声明可以安全地将无效超时ID传递给'clearTimeout'？ – 6502

用JavaScript添加“延迟”功能

回答

相关问题