addEventListener 如何判断一定时间内是否触发事件

2017-05-09 17:39:43 +08:00
 wico97

if (window.DeviceMotionEvent) { window.addEventListener("devicemotion", motionHandler, false); } else { document.body.innerHTML = "What user agent u r using???"; } 很多时候要等很久才触发事件。所以很影响页面加载。如何给 eventlistener 设置个 timer,在一定时间内如果不触发时间就输出默认值?

2913 次点击
所在节点    JavaScript
7 条回复
geelaw
2017-05-09 17:54:14 +08:00
你可以用一个值手动触发这个 handler 让页面正常加载。
geelaw
2017-05-09 18:00:02 +08:00
当然如果你执意要判断事件的发生,可以用 setTimeout。

(function ()
{

var happened = false;
var happenedHandler = function() { happened = true; };
var detectIfHappenedHandler = function ()
{
if (!happened)
alert('The event has not happened since it was registered.');
});
window.addEventListener('yourEvent', happenedHandler, false);
window.setTimeout(detectIfHappenedHandler, 1000)

})();
geelaw
2017-05-09 18:02:13 +08:00
@geelaw 更正:


(function ()
{

var happened = false;

var happenedHandler = function()
{
window.removeEventListener('yourEvent', happenedHandler, false);
happened = true;
};

var detectIfHappenedHandler = function ()
{
if (!happened)
alert('The event has not happened since it was registered.');
};

window.addEventListener('yourEvent', happenedHandler, false);
window.setTimeout(detectIfHappenedHandler, 1000)

})();
wico97
2017-05-09 20:00:36 +08:00
@geelaw 不过这样也不能判断在一定时间内捕捉到 event 呀。最好想在页面加载的时候就判断是否捕捉到事件,否则输出默认值。
geelaw
2017-05-09 20:03:19 +08:00
@wico97 不明白你在说什么。如果上面那段代码执行之后 1 秒后没有发生 yourEvent,那么 detectIfHappenedHandler 就会运行。

如果你想知道 yourEvent 到底会不会发生,你只能问问浏览器支不支持,如果浏览器的实现是坏掉的,那你是无能为力的。
Lxxyx
2017-05-09 21:10:48 +08:00
throttle 和 debounce,可以看看 loadsh 里的实现
wico97
2017-05-10 03:38:36 +08:00
@geelaw 谢谢。解决了

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/360185

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX