Question

这是我目前的代码

google.maps.event.addListener(marker, `mouseover`, function() { 
  alert('loaded when i hovered');
});

但是如果鼠标超过元素两秒，我希望执行该功能。

我尝试了这个，但它没有用。

 google.maps.event.addListener(marker, `mouseover  2000`, function() { 
   alert('loaded after then when i stay mouse 2 sec'); 
 });

我需要做什么才能在两秒悬停后执行该功能？

Answer 1

您需要使用计时器。将它设置为鼠标悬停，然后在计时器回调中完成你的工作;您还需要处理停止计时器的mouseout事件。

var timeoutId = null;
google.maps.event.addListener(marker, 'mouseover',function() { 
   timeoutId = window.setTimeout(function(){
     alert("I did it!");
   }, 2000);
 } );

// Cancel your action if mouse moved out within 2 sec
google.maps.event.addListener(marker, 'mouseout',function() { 
  window.clearTimeout(timeoutId)
});

Answer 2

使用setTimeout

会是这样的

var timer;

google.maps.event.addListener(marker, 'mouseover', function() {        
   timer = window.setTimeout(function(){
     alert("Stackoverflow Rocks!!!");
   }, 2000);
 } );

google.maps.event.addListener(marker, 'mouseout', function() {        
   window.clearTimeout(timer);
 } );

Answer 3

在mouseover事件中调用setTimeout。将返回值存储在共享的某处（例如，在闭包中）。

在mouseout事件中调用clearTimeout。如果在两秒钟之前该事件未触发，则将调用您传递给setTimeout的函数。

如何在两秒钟悬停后执行功能？

3 个答案: