下面小編就為大家帶來一篇js鼠標單擊和雙擊事件沖突問題的快速解決方法。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。
情況一
如果在一個DOM對象上同時綁定單擊(click)和雙擊(dblclick)事件，當在這個DOM對象上發生雙擊事件時，第一次點擊（click）會 觸發一次單擊（click）事件，第二次點擊（連續的）也會觸發雙擊（dblclick）事件，還是會觸發單擊（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（避免觸發單擊事件）。
第二種：
<title>區分單擊和雙擊-www.jb51.net</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鼠標單擊和雙擊事件沖突問題的快速解決方法就是小編分享給大家的全部內容了，希望能給大家一個參考
公眾號
事業單位
當前位置：
公考類
招聘類
各類考試
