js中模擬移動端長按效果

我們都知道 js 是有onmousedown（鼠標按下事件）和onmouseup（鼠標抬起事件），剛開始我的思路是 鼠標抬起時間減去鼠標按下時間

var oDiv = document.getElementById('div1');
var timer1;
var timer2;
oDiv.onmousedown = function () {
　　timer1 = new Date();
}
oDiv.onmouseup = function () {
　　timer2 = new Date();
　　var timer3 = timer2.getTime() - timer1.getTime();
　　if (timer3 > 1000)
　　　　alert('aa');
　　}
}

 

這么寫倒是也能實現 但是 必須要 鼠標抬起才能觸發（鼠標按住10秒不松開，也不會出現效果。。。實際測試效果很不爽，感覺特別扭）。這個跟咱們安卓的使用感覺是不同的。。。安卓的那個長按 是 按住開始計時到時間就立馬出現效果，
於是最終改版如下：

var oDiv = document.getElementById('div1')
var myVar;
oDiv.onmousedown = function () {
myVar = setTimeout(function () {
　　alert('aa');
　}, 1000);
}
oDiv.onmouseup = function () {
　　clearTimeout(myVar);
}

 

---