javascript當中mouseDown事件，mouseUp,和mouseClick執(zhí)行順序

mouseDown事件，mouseUp,和mouseClick執(zhí)行順序
馬克- to-win：馬克 java社區(qū)：防盜版實名手機尾號： 73203。
馬克-to-win：下例仔細剖析了mouseDown和mouseClick的關系。當兩個對象重疊在一起，（比如這里document和span），一定是先執(zhí)行所有元素的mouseDown事件，之后所有元素的mouseUp,之后執(zhí)行所有元素的mouseClick。（有一點切記注意，本例子測試過程中不能用alert，如用alert，down事件后不會再執(zhí)行click事件了。事件就被alert打斷了。）



例 11.1

<html>
<head>
    <title>根據(jù)實驗，本例仔細剖析了mouseDown和mouseClick的關系。當兩個對象重疊在一起，（比如這里 document和span），一定是先執(zhí)行所有元素的mouseDown事件，之后所有元素的mouseUp,之后執(zhí)行所有元素的 mouseClick</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <SCRIPT language=JavaScript>
        function linkClickHandler(event) {
        //    alert(event.srcElement+"is event.srcElement");
        //    alert(event.target+"is event.target");
            var t =event.srcElement||event.target;
         //   alert(t.id+" qq1 ");
            sss2.innerHTML += t.id+" click ";
        }
      
        function linkDownHandler(event) {
       //     alert(event.srcElement+"ddddddddis event.srcElement");
       //     alert(event.target+"is event.target");
            var t =event.srcElement||event.target;
       //     alert(t.id+" qq1 ");
            sss2.innerHTML += t.id+" down ";
        }
      
        function documClickHandler(event) {
        if (document.all) {
        }else{
       //     alert("event.currentTarget is "+event.currentTarget+" event.type is "+event.type+" event.eventPhase is "+event.eventPhase+"eventPhase等于3是冒泡階段不是capture階段");
/*Event.CAPTURING_PHASE     1
Event.AT_TARGET     2
Event.BUBBLING_PHASE*/     
              sss2.innerHTML += " event.type is "+event.type+" event.eventPhase is "+event.eventPhase+"eventPhase等于3是冒泡階段不是capture階段"+" document click ";
        }



        }
      
      
        function documDownHandler(event) {
        if (document.all) {
        }else{
        //    alert("down dddddd   event.currentTarget is "+event.currentTarget+" event.type is "+event.type+" event.eventPhase is "+event.eventPhase+"eventPhase等于3是冒泡階段不是capture階段");
            sss2.innerHTML += " event.type is "+event.type+" event.eventPhase is "+event.eventPhase+"eventPhase等于3是冒泡階段不是capture階段"+" document down ";
          
        }

        }
       document.onclick = documClickHandler;
       document.onmousedown = documDownHandler;
    </script>
</head>
<body>
        <span id="sss2" onClick="linkClickHandler(event);" onMouseDown="linkDownHandler(event);">
        點我</span>
</body>
</html>