JS中的事件類型和事件屬性的基礎(chǔ)知識

        
        
            
            
        
        
        
            test        
        
        
        

    
    
            test
            //圖像被刪除不觸發(fā)unload事件;        

    
    
            sdfs        

    result:0
 calc 

    
     calc 
    
        chrome 的結(jié)果
            focus
            focusin
            body focusin
            DOMFocusIn
            blur
            focusout
            body focusout
            DOMFocusOut
        firefox的結(jié)果：
            "focus"
            "blur"

        chorme所有的冒泡事件都支持。
        火狐34還是只支持focus 和blur， 而且界面一開始就自動對body進行了focus;    

    
    
        
        
    
    
     calc 
    

    
    
    
    

    
    
        
        
    
    
     calc 

事件名字只要包含mouse， 都只能通過鼠標(biāo)的觸發(fā)比如, 無法通過鍵盤觸發(fā)的事件：
　　mousedown,
　　mousemove,
　　mouseout,
　　mouseover,
　　mouseup
　　mouseenter, (要注意這個事件， chrome的高版本才支持的, 這個事件是ie先弄出來的，jQ有做兼容處理所以在chrome下可以使用這個事件)　　
　　mouseleaver (要注意這個事件， chrome的高版本才支持的, 這個事件是ie先弄出來的，jQ有做兼容處理所以在chrome下可以使用這個事件);

因為常用的點擊都是鼠標(biāo)左鍵， 所以要觸發(fā)dblclick會觸發(fā)大部分的mouse事件；
比如你要觸發(fā)dblclick， 也會依次觸發(fā)
1: mousedown
2: mouseup
3: click
4: mousedown
5: mouseup
6: click
7: dblclick;

要檢測鼠標(biāo)事件的兼容通過：
　　document.implementation.hasFeature("MouseEvents","2.0") //true （注意注意，DOM2的事件檢測的名字是復(fù)數(shù)，要加一個s，DOM3的不用的）
　　document.implementation.hasFeature("MouseEvent","3.0") //true
　　document.implementation.hasFeature("MouseEvent","4.0") //true
　　document.implementation.hasFeature("MouseEvent","5.0") //true
　　chrome和firefox這兩個奇葩了(IE? IE是什么能吃嗎？)， 無論怎么傳都是true, 我勒個去;新航道雅思

事件對象的屬性：
客戶坐標(biāo)的值：
　　clientX
　　clientY
頁面坐標(biāo)的值：
　　pageX
　　pageY;
IE8以及更早版本沒有pageX這個值，我們可以通過客戶指標(biāo)的值(clientX,clientY)和界面的滾動條算出來；
　　pageX = clientX + document.documentElement.scrollLeft || document.body.scrollLeft (IE8以及之前的2px沒有處理哦)
　　pageY = clientY + document.documentElement.scrollTop || document.body.scrollTop; (同上)
屏幕的坐標(biāo)：
　　screenX
　　screenY (這兩個屬性我從來沒有用過..)
修改鍵(熱鍵,也叫快捷鍵)：
//這幾個值都在事件對象下面;
　　ctrlKey,
　　shiftKey,
　　altKey,
　　metaKey( WINDOW中是窗口鍵， 蘋果電腦是CMD鍵 )
　　

相關(guān)元素（relateTarget）:
　　　　IE下沒有relateTarget這個東東， 有個toElement和fromElement;這個屬性沒啥用， 唯一的用處就是在不支持mouseenter以及mouseleave的瀏覽器中模擬這兩個事件(chrome低版本);

鼠標(biāo)按鈕：
　　　　平常用的不多，就是在鼠標(biāo)按下去的時候是鼠標(biāo)左鍵還是中鍵還是鼠標(biāo)右鍵的區(qū)別；
　　　　IE8以及之前對鼠標(biāo)的按鍵的規(guī)定和DOM3區(qū)別很大，DOM3是這樣規(guī)定的：
　　　　　　0：鼠標(biāo)左鍵，
　　　　　　1：鼠標(biāo)中鍵（滾動鍵）；
　　　　　　2：鼠標(biāo)右鍵；
　　因為IE和DOM2,DOM3按鈕事件屬性(event)都有button這個屬性，必須通過hasFearture進行判斷（也沒有別的方法了吧，soga）,so,兼容代碼要如下：

運行下面代碼

            if( document.implementation.hasFearture("MouseEvents","2.0")return event.button,
            else{
                swtich( event.button ) {
                    case 0:
                    case 1:
                    case 3:
                    case 5:
                    case 7:
                        return 0;
                    case 2:
                    case 6:
                        return 2;
                    case 4 :
                        return 1
                };
            }

現(xiàn)在到了滾輪事件了：

IE和chrome以及opera的鼠標(biāo)滾輪滾動都是通過event.wheelDelta標(biāo)識的;
　　如果滾輪是向上滾動那么wheelDelta為120，向下值為-120； 哇擦家里么喲鼠標(biāo)， 筆記本的滾輪怎么滾啊，（￣Ｑ￣）╯，先貼代碼吧，

運行下面代碼

        
        
            
            
        
        
        
         xx            

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                

                
hehe                

                

                

                

                
hehe                

                

                

                

                
hehe                

                

                

                

                
hehe                

                

                

                

                
hehe