如果在一個DOM對象上同時綁定單擊(click)和雙擊(dblclick)事件，當在這個DOM對象上發(fā)生雙擊事件時，第一次點擊（click）會觸發(fā)一次單擊（click）事件，第二次點擊（連續(xù)的）也會觸發(fā)雙擊（dblclick）事件，還是會觸發(fā)單擊（click）事件（IE7與 firefox）。

解決方法：

<button onclick="test(1)" ondblclick="test(2)"></button>
<script language="javascript">
var i = 1;
function test(n)  {
i = n; 
var val = setTimeout("call();",250); 
if(i==2){
clearTimeout(val);
}
}
function  call()  { 
if(i==1){
alert('click');
}else if(i==2){
alert('dblclick');
}
} 
</script>

解釋：

第一次點擊記錄下點擊的時間，并設置單擊事件的Timeout（250ms比較合適），第二次點擊時判斷此時點擊的時間與上次點擊的時間間隔，如果小于指定的事件間隔（比如250ms），則判斷為雙擊事件，并clear已設置的Timeout（避免觸發(fā)單擊事件）。

第二種：

<title>區(qū)分單擊和雙擊-www.dbjr.com.cn</title>
<script type="text/javascript">
var flag=0;
function clickTest()
{
 if(!flag)
 {
 setTimeout("tt2();",300);
 }
 flag++;
}
function reset()
{
 flag=0;
}
function singleClick()
{
 var result=document.getElementByIdx_x('result');
 result.innerHTML=result.innerHTML+"click<br>";
 reset();
}
function dobuleClick()
{
 var result=document.getElementByIdx_x('result');
 result.innerHTML=result.innerHTML+"dobule click<br>";
 reset();
}
function tt2()
{
 if(flag==1)
 {
 singleClick();
 }
 else
 {
 dobuleClick();
 }
}
</script>
</head>
<body>
<input type="button" ondblclick="clickTest();" onclick="clickTest();" value="click test" />
<div id="result"></div>

以上這篇js鼠標單擊和雙擊事件沖突問題的快速解決方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

js substr、substring和slice使用說明小記
關于substr、substring和slice方法區(qū)別的文章，網(wǎng)上搜到了許多，文章內(nèi)容也基本一致。而后，我將其中一篇文章中的代碼挪到本地進行了測試，發(fā)現(xiàn)測試結果和原文中的有些出入。
2011-09-09
js判斷兩個數(shù)組是否存在相同元素的四種方法
這篇文章主要給大家介紹了關于js判斷兩個數(shù)組是否存在相同元素的四種方法,js中是不能直接用==或者===來計算兩個數(shù)組是否相等的,那么就需要對數(shù)組的值進行比較,需要的朋友可以參考下
2023-07-07
javascript關鍵字加亮加連接
我想在頁面里把想要的關鍵詞加亮凸出(用顏色區(qū)分出來)顯示,這樣讓客戶一眼能看到重的東西,然后在加亮的關鍵詞上可以加上超連接.請問高手們怎么實現(xiàn)宋的功能.就像搜索引擎的那種..搜索關鍵詞的時候就顯示紅色的.
2008-06-06
javascript數(shù)組快速打亂重排的方法
本文介紹了利用Array.prototype.sort方法和Math.random()實現(xiàn)快速打亂數(shù)組的方法，大家參考使用吧
2014-01-01
解決uni-app微信小程序input輸入框在底部時,鍵盤彈起頁面整體上移問題
問題是這樣的input?獲取焦點時會自動調(diào)起手機鍵盤，設置?:adjust-position="true"，會導致鍵盤彈起時頁面整體上移，這篇文章主要介紹了解決uni-app微信小程序input輸入框在底部時，鍵盤彈起頁面整體上移問題,，需要的朋友可以參考下
2022-08-08
JS實現(xiàn)網(wǎng)頁煙花動畫效果
這篇文章主要為大家詳細介紹了JS實現(xiàn)網(wǎng)頁煙花動畫效果，點擊鼠標煙花向四周擴散，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2020-03-03
javascript如何返回字符串的所有排列
這篇文章主要介紹了javascript如何返回字符串的所有排列問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2023-01-01
Javascript 鍵盤事件的組合使用實現(xiàn)代碼
Javascript 鍵盤事件的組合使用實現(xiàn)代碼，需要的朋友可以參考下
2012-05-05
JS預覽圖像將本地圖片顯示到瀏覽器上
本代碼從file域獲取本地圖片url并將本地圖片顯示到瀏覽器上，具體實現(xiàn)如下，感興趣的朋友可以參考下，希望對大家有所幫助
2013-08-08
省市區(qū)三級聯(lián)動下拉框菜單javascript版
這篇文章主要給大家介紹了javascript實現(xiàn)省市區(qū)三級聯(lián)動下拉框菜單，有需要的朋友可以參考下
2015-08-08