首頁 > 開發者 > JavaScript
JQuery實現當滑鼠停留在某地區3秒後自動執行，jquery
這篇文章主要介紹了JQuery實現當滑鼠停留在某地區3秒後自動執行，可以應用於很多情境
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script></head><style type="text/css">.main{width:500px;height:400px;border:dashed 1px #ccc;margin:0 auto;line-height:400px;text-align:center;}</style><body><script type="text/javascript">$(function(){$(".main").mouseover(function(){setTimeout(function(){alert('當你的滑鼠移動到框體時，我會延遲3秒才顯示哦！');},3000)});})</script><div class="main">把滑鼠移入此框體中，等待3秒。</div> </body></html>
假設這個地區:<div id="div1"></div>
var timer = setTimeout(function(){
$("#div1").mouseover(function(){
//執行方法
});
}, 3000);
怎用JQuery實現當滑鼠停留在某地區3秒後執行方法
onmouseenter事件記錄時間
var timer = null;
$('div').hover(function(){ timer = setTimeout(function(){ //做你想做的事 },3000);},function(){ //這裡去clear clearTimeout(timer);//如果沒停留3秒,直接會被clear掉,如果停留超過3秒,也一樣會被clear,但是你要做的方法已經被執行了});
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
