十年專注于品牌網站建設 十余年專注于網站建設_小程序開發_APP開發,低調、敢創新、有情懷!
      南昌百恒網絡微信公眾號 掃一掃關注
      小程序
      tel-icon全國服務熱線:400-680-9298,0791-88117053
      掃一掃關注百恒網絡微信公眾號
      掃一掃打開百恒網絡微信小程序

      百恒網絡

      南昌百恒網絡

      javascript中鼠標按鈕事件判斷方法

      百恒網絡 2016-12-22 6042

      只有在主鼠標按鈕被單擊(或鍵盤回車鍵被按下)時才會觸發 click 事件,因此檢測按鈕的信息 并不是必要的。但對于 mousedown 和 mouseup 事件來說,則在其 event 對象存在一個 button 屬性, 表示按下或釋放的按鈕。DOM的 button 屬性可能有如下 3個值:0 表示主鼠標按鈕,1 表示中間的鼠 標按鈕(鼠標滾輪按鈕) ,2 表示次鼠標按鈕。在常規的設置中,主鼠標按鈕就是鼠標左鍵,而次鼠標 按鈕就是鼠標右鍵。
      ? ? ? ? IE8及之前版本也提供了 button 屬性,但這個屬性的值與 DOM的 button 屬性有很大差異。
      ? ? ? ?0:表示沒有按下按鈕。?
      ? ? ? ?1:表示按下了主鼠標按鈕。?
      ? ? ? ?2:表示按下了次鼠標按鈕。?
      ? ? ? ?3:表示同時按下了主、次鼠標按鈕。?
      ? ? ? ?4:表示按下了中間的鼠標按鈕。?
      ? ? ? ?5:表示同時按下了主鼠標按鈕和中間的鼠標按鈕。?
      ? ? ? ?6:表示同時按下了次鼠標按鈕和中間的鼠標按鈕。?
      ? ? ? ?7:表示同時按下了三個鼠標按鈕。?
      ? ? ? ?不難想見,DOM模型下的 button 屬性比 IE模型下的 button 屬性更簡單也更為實用,之所以是這樣,南昌網站制作公司百恒網絡前端開發工程師告訴大家原因是同時按下多個鼠標按鈕的情形十分罕見。常見的做法就是將 IE模型規范化為 DOM方式,畢竟除 IE8及更 早版本之外的其他瀏覽器都原生支持 DOM模型。而對主、中、次按鈕的映射并不困難,只要將 IE的其 他選項分別轉換成如同按下這三個按鍵中的一個即可(同時將主按鈕作為優先選取的對象)。換句話說, IE中返回的 5 和 7 會被轉換成 DOM模型中的 0。?
      ? ? ? ?由于單獨使用能力檢測無法確定差異(兩種模型有同名的 button 屬性),因此必須另辟蹊徑。我 們知道,支持 DOM 版鼠標事件的瀏覽器可以通過 hasFearture()方法來檢測,所以可以再為 EventUtil 對象添加如下 getButton()方法。?
      var EventUtil = {?
      //省略了其他代碼?

      getButton: function(event){
      if (document.implementation.hasFeature("MouseEvents", "2.0")){
      ? ? ? ?return event.button;
      } else {
      ? ? ? ?switch(event.button){
      ? ? ? ? ? ? ? case 0:
      ? ? ? ? ? ? ? case 1:
      ? ? ? ? ? ? ? case 3:
      ? ? ? ? ? ? ? case 5:
      ? ? ? ? ? ? ? case 7:
      ? ? ? ? ? ? ? ? ? ? ?return 0;
      ? ? ? ? ? ? ? case 2:
      ? ? ? ? ? ? ? case 6:
      ? ? ? ? ? ? ? ? ? ? ?return 2;
      ? ? ? ? ? ? ? case 4: return 1;
      ? ? ? ? ? ? ? }
      ? ? ? ?}
      },
      //省略了其他代碼?
      };?
      ? ? ? ?通過檢測"MouseEvents"這個特性,就可以確定 event 對象中存在的 button 屬性中是否包含正 確的值。如果測試失敗,說明是 IE,就必須對相應的值進行規范化。以下是使用該方法的示例。?


      ? ? ? ?在這個例子中,我們為一個

      元素添加了一個 onmousedown 事件處理程序。當在這個元素上 按下鼠標按鈕時,會有警告框顯示按鈕的代碼。
      ? ? ? ?在使用 onmouseup 事件處理程序時,button 的值表示釋放的是哪個按鈕。此 外,如果不是按下或釋放了主鼠標按鈕,Opera 不會觸發 mouseup 或 mousedown 事件。?
      ? 本文僅限內部技術人員學習交流,不得作于其他商業用途.希望此文對廣大技人員有所幫助。原創文章出自:南昌網站建設公司-百恒網絡http://www.dgscpc.com/如轉載請注明出處!

      400-680-9298,0791-88117053
      掃一掃關注百恒網絡微信公眾號
      掃一掃打開百恒網絡小程序

      歡迎您的光顧,我們將竭誠為您服務×

       
       
       
       
       
       
       
       
      ×
      99re视频热这里只有精品7 | 久久精品国产99久久久香蕉| 国产精品无码一区二区三区免费| 99精品热这里只有精品| 99久久精品免费精品国产| 国产精品对白交换视频| 99久久99这里只有免费的精品| 亚洲精品无码av天堂| selaoban在线视频免费精品| 日韩福利电影在线观看| 四虎永久在线精品免费影视 | 九九久久精品国产AV片国产| 亚洲av日韩av无码| 无码国产亚洲日韩国精品视频一区二区三区| 韩国精品一区二区三区无码视频 | 亚洲精品国产高清嫩草影院| 日韩一区二区三区电影在线观看| 日韩人妻无码精品一专区| 日韩精品一区二区三区中文字幕 | 亚洲婷婷国产精品电影人久久| 老司机免费午夜精品视频| 日韩在线免费视频| 日韩精品福利视频一区二区三区| 亚洲欧美日韩综合俺去了| 亚洲精品日韩一区二区小说| 中文字幕无码亚洲欧洲日韩| 日韩精品一区二区三区国语自制| 婷婷国产成人精品一区二| 拍国产真实乱人偷精品| 午夜肉伦伦影院久久精品免费看国产一区二区三区 | 日韩熟女精品一区二区三区| 国产成人精品123区免费视频| 日韩少妇内射免费播放| 日韩亚洲一区二区三区| 日韩中文字幕在线观看| 国产AV日韩A∨亚洲AV电影 | 国产大片91精品免费观看不卡| 亚欧人成精品免费观看| 国产精品bbwbbwbbw| 欧美日韩精品SUV| 在线精品日韩一区二区三区|