本文来自程式先锋技术维客 [url]www.javabiz.cn[/url]
在我们进行网页开发的过程中经常会遇到这么一个问题，为一个链接注册双击事件，或者让一个按钮或者其他元素上面同时注册单击或者双击事件，这时候我 们发现网页中的双击事件似乎永远都不会起作用，原因是当我们点击一次的时候，就被超链接或者单击事件截获了，本文描述了一个如何解决这个技术问题的具体方 法。本解决方案的实现原理是，单击事件和双击事件都调用同一个方法，我们根据两次鼠标点击的间隔事件来判断到底是单击还是双击事件。单击事件来临的时候先 不调用，等一小段时间，过了这段时间，如果没有下一次单击来临就开始调用单击对应的操作，如果有下一次点击就调用双击。
详细描述请参加下面代码清单：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> javascript 实现单击和双击并存 </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="http://www.javabiz.cn">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>

 <BODY>
  <SCRIPT LANGUAGE="JavaScript">
  <!--
 var dcTime=250;    // doubleclick time
 var dcDelay=100;   // no clicks after doubleclick
 var dcAt=0;        // time of doubleclick
 var savEvent=null; // save Event for handling doClick().
 var savEvtTime=0;  // save time of click event.
 var savTO=null;    // handle of click setTimeOut
 
 function showMe(txt) {
   document.forms[0].elements[0].value += txt;
 }
 
 function handleWisely(which) {
   switch (which) {
     case "click":      
       savEvent = which;
       d = new Date();
       savEvtTime = d.getTime();
       savTO = setTimeout("doClick(savEvent)", dcTime);
       break;
     case "dblclick":
       doDoubleClick(which);
       break;
     default:
   }
 }
 
 function doClick(which) {
   if (savEvtTime - dcAt <= 0) {
     return false;
   }
   showMe("单击");
 }
 
 function doDoubleClick(which) {
   var d = new Date();
   dcAt = d.getTime();
   if (savTO != null) {
     savTO = null;
   }
   showMe("双击");
 }

  //-->
  </SCRIPT>

<p>
       <a href="javascript:void(0)"
         οnclick="handleWisely(event.type)"
         οndblclick="handleWisely(event.type)"
         style="color: blue; font-family: arial; cursor: hand">
      点击一下看看结果：
    </a>
    </p>

    
    <form>
      <table>
        <tr>
          <td valign="top">
           事件模式: <textarea rows="4" cols="60" wrap="soft"></textarea>
          </td>
        </tr>
        <tr>

          <td valign="top">
            <input type="Reset">
          </td>
        </tr>
      </table>
    </form>
 </BODY>
</HTML>