對JavaScript中的事件的分類
我們也都知道JavaScript中的事件是有很多種,而且還很常用,重要的是還不好記住,寫到JavaScript事件的時候就看一次,找的時候還不是很好找,這很頭痛了,那麼我們就來對JavaScript中的事件進行一下分類
滑鼠點擊事件
mousedown、mousemove、mouseout、dblclick(雙擊)、contextmenu(右鍵選單)
滑鼠滾輪事件mousewheel
滾輪事件,適用於IE /Googlesafari,DOMMouseScroll–>火狐私有的滾輪事件,只能用addEventListener()方式綁定。
e.wheelDelta > 0表示滾輪向上。 e.wheelDelta < 0表示滾輪向下。 e.detail<0表示滾輪向上,e.detail>0表示滾輪向下,火狐私有。
鍵盤事件
keypress、keydown、keyup
keydown可以偵測到鍵盤所有,包含實體鍵,已經輔助鍵【ctrl,shift, alt,f1…】
keypress只能偵測到實體鍵【字符,字母,數字,符號,空格】,並且可以偵測出字母大小寫,偵測你所按的鍵e.keyCode
#觸控螢幕事件
touchstart,手指按下螢幕觸發
touchmove,手指在螢幕上滑動
touchend,手指離開螢幕觸發
touchcancel,觸螢幕事件取消
動畫事件
#縮放pinchstart 縮放手勢起點
pinchend 縮放手勢終點
pinch 縮放手勢
# pinchin 收縮
pinchout 放大
旋轉rotateleft 向左旋轉
rotateright 向右旋轉
rotate 旋轉
滑動swipestart 滑動手勢起點
swiping 滑動中
ipeend 滑動手勢終點#swipeleft 向左滑動
swiperight 向右滑動
swipeup 向上滑動
swipedown 向下滑動
swipe 滑動
拖曳開始dragstart 拖曳螢幕
拖曳dra
拖曳結束dragend 拖曳螢幕
拖曳drag 拖曳手勢
長按hold 長按螢幕
敲擊tap 點選畫面
#表單事件
onchange[表單下拉清單元素改變時], oninput[文字方塊輸入時]
onsubmit[表單提交時]
onfocus[取得焦點] onblur[失去焦點]
事件綁定的兩種方式。 on和addEventListener()
1、on事件綁定 透過on這種方式綁定的事件可以透過,可以透過設定為NULL來移除。
on事件只能加入到事件的冒泡階段。
2、addEventListener() 透過addEventListener(type,handle,boolean)這種方式綁定的事件可以透過removeEventListener(type,handle,boolean)來
移除事件。 boolean為false綁定到事件的冒泡階段。為true綁定到事件的捕捉階段。
事件冒泡與捕捉
阻止冒泡: 透過on這個方式綁定的事件,使用e .cancelBubble = true;
addEventListener 使用e.stopPropagation()阻止事件傳播
阻止預設事件 1、return false;
#2、event.preventDefault;
以上是對JavaScript中的事件的分類的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

人臉偵測辨識技術已經是一個比較成熟且應用廣泛的技術。而目前最廣泛的網路應用語言非JS莫屬,在Web前端實現人臉偵測辨識相比後端的人臉辨識有優勢也有弱勢。優點包括減少網路互動、即時識別,大大縮短了使用者等待時間,提高了使用者體驗;弱勢是:受到模型大小限制,其中準確率也有限。如何在web端使用js實現人臉偵測呢?為了實現Web端人臉識別,需要熟悉相關的程式語言和技術,如JavaScript、HTML、CSS、WebRTC等。同時也需要掌握相關的電腦視覺和人工智慧技術。值得注意的是,由於Web端的計

JSP註解的分類及用法解析JSP註解分為兩種:單行註解:以結尾,只能註解單行程式碼。多行註解:以/*開頭,以*/結尾,可以註解多行程式碼。單行註解範例多行註解範例/**這是一段多行註解*可以註解多行程式碼*/JSP註解的用法JSP註解可以用來註解JSP程式碼,使其更易於閱

WebSocket與JavaScript:實現即時監控系統的關鍵技術引言:隨著互聯網技術的快速發展,即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用,並給出程式碼範例,詳細解釋其實作原理。一、WebSocket技

股票分析必備工具:學習PHP和JS繪製蠟燭圖的步驟,需要具體程式碼範例隨著網路和科技的快速發展,股票交易已成為許多投資者的重要途徑之一。而股票分析是投資人決策的重要一環,其中蠟燭圖被廣泛應用於技術分析。學習如何使用PHP和JS繪製蠟燭圖將為投資者提供更多直觀的信息,幫助他們更好地做出決策。蠟燭圖是一種以蠟燭形狀來展示股票價格的技術圖表。它展示了股票價格的

隨著網路金融的快速發展,股票投資已經成為了越來越多人的選擇。而在股票交易中,蠟燭圖是常用的技術分析方法,它能夠顯示股票價格的變動趨勢,幫助投資人做出更精準的決策。本文將透過介紹PHP和JS的開發技巧,帶領讀者了解如何繪製股票蠟燭圖,並提供具體的程式碼範例。一、了解股票蠟燭圖在介紹如何繪製股票蠟燭圖之前,我們首先需要先了解什麼是蠟燭圖。蠟燭圖是由日本人

JavaScript教學:如何取得HTTP狀態碼,需要具體程式碼範例前言:在Web開發中,經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時,我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功,並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼,並提供一些實用的程式碼範例。使用XMLHttpRequest

js和vue的關係:1、JS作為Web開發基石;2、Vue.js作為前端框架的崛起;3、JS與Vue的互補關係;4、JS與Vue的實踐應用。

JavaScript中的HTTP狀態碼取得方法簡介:在進行前端開發中,我們常常需要處理與後端介面的交互,而HTTP狀態碼就是其中非常重要的一部分。了解並取得HTTP狀態碼有助於我們更好地處理介面傳回的資料。本文將介紹使用JavaScript取得HTTP狀態碼的方法,並提供具體程式碼範例。一、什麼是HTTP狀態碼HTTP狀態碼是指當瀏覽器向伺服器發起請求時,服務
