[精讚] [會員登入]
858

【Javascript】(Event)常用的網頁事件

不寫下來絕對下又會忘記,然後每次又都要回到MDN去查,麻煩

分享此文連結 //n.sfs.tw/16030

分享連結 【Javascript】(Event)常用的網頁事件@小編過路君子
(文章歡迎轉載,務必尊重版權註明連結來源)
2022-12-27 23:41:24 最後編修
2022-12-27 20:22:46 By 過路君子
 

哈囉大家好,這裡是早上才覺得天氣回暖的小編過路君子

結果太陽才剛下山就冷的咪咪茂茂,這星期回暖,但是下星期又要開始冷了。

 

 

小編本人偶爾會去寫寫 Javascript 的程式,然而每次都間隔了好幾個月,導致寫得當下對於有什麼事件都忘光了。

每次都要去重查有哪些事件,所以在這裡將小編常用的一些事件列出,這樣以後小編就可以直接查表啦!

基本上小編會從這個網頁直接搬過來,所以有興趣的人可以直接連結過去查看。

 

網頁本身相關Events

Event 意義
DOMContentLoaded 當網頁 HTML 加載成功且瀏覽器創建 document 物件的時候觸發,此時 CSS、圖片或字形等等資源檔案有可能尚未加載完成。
load 當所有的網頁資源加載完成之後觸發,包含所有的CSS、圖片、字型等等資源檔案。
beforeunload 當網頁本身、CSS、圖片等等資源即將被關閉、卸載時會被觸發。
unload 當document被卸載貨是子資源被卸載時觸發。

 

響應使用者操作相關Events

Event 意義
error 當 Javascrept 執行時發生錯誤或是找不到資源檔案的時候被觸發。
cut 當使用者進行剪下(Ctrl + X)動作時觸發。
copy 當使用者進行複製(Ctrl + C)動作時觸發,很多網站禁止複製都適用此 Event 達成。
paste 當使用者進行貼上(Ctrl + V)動作時觸發。
resize 當使用者改變瀏覽器大小的時候會被觸發。
storage 當其他相同網域下的其他網頁更動 localStorage 觸發。

 

與網路狀態相關的Event

Event 意義
online 當瀏覽器連上網路並且 navigator.onLine 被切換成 true 時觸發。
offline 當瀏覽器失去網路的連線並且 navigator.onLine 切換成 false 時觸發。

 

input上常用的Event

Event 意義
blur 當失去焦點的時候被觸發
focus 當獲得焦點的時候被觸發

 

 

 

後記

小編常用的大概就是上面幾個事件,當然絕對不只這幾個事件。

例如小編之前在寫 NodeJS 的時候還有用過 message 這個事件,用於兩個不同執行緒上的程式溝通,但在網頁上小編至今沒有用過這個手法,所以就沒列出。

END

你可能感興趣的文章

【Wildfly/jBoss】[Linux](Connection Datasource)如何與MySQL資料庫建立連線 網頁瀏覽器和資料庫的關係密不可分,而通常會將兩者分開架設在不同的伺服器上面來提供服務,這時要如何進行連線呢?

【Docker&Wildfly】(bitnami/wildfly)如何從零開始創建網頁伺服器 使用他人的 docker image 來架設我們的 wildfly web server

【MEGAcmd】[Linux] 如何解決Unable to connect to service: error=2 用了好久的軟體突然停止一切的運作了。

【JDA/discord bot】取得頻道第一筆或最新(最後一筆)的歷史訊息 在不處理訊息的先後順序下取得相關的歷史訊息

【CoreProtect】[SpigotMC] (進階篇) 如何直接存取資料 大家好,這裡是準備要去參加FF38的小編過路君子 本來只要自己去,結果臨時有人說要一起去,那...好吧!走~ 對於一般人

【C++】一些好用的C++小功能 —— 貳 承襲上一篇的C++小功能,筆記下來以免自己以後忘記了。

隨機好文

[活動] 2017年4/1雲空幻想愚人節活動彩蛋&攻略 (紀念性質) 雲空幻想2017年的愚人節活動介紹同時也是本小編的第一篇網路文章(*^ω^)♪

高捷少女:地下城的探險少女① 婕兒心中一奇,便走上前看著仔細。那塊凹進去的地方中心大約三公分厚,越往邊緣就越淺,圓型直徑十五公分。婕兒拿出銅盤對比一下,發現兩者大小竟然一致,銅盤似乎能夠完整的嵌進去。     婕兒看著凹槽,心中

高捷少女:美麗島的守護者① 婕兒跟耐耐嚇得臉色發白。「耐耐,小穹有這方面的愛好喔?」婕兒小聲地說。耐耐默默的拿出筆記本,臉上浮現一層微笑:「這麼大的新聞,要趕快記下來!」

高捷少女:美麗島的守護者③ 小雅閉上眼睛,思索在高捷發生的點點滴滴。她心意已決,在高捷的日子的確也有快樂的部分,不過她相信換個方向是更好的決定。有關高捷的所有美好回憶,小雅決定保留在心裡就好,繼續在高捷工作只會讓自己更痛苦而已,

高捷少女:耐耐的新年驚喜① 耐耐拿出手機。「我回來囉。」她說。幾分鐘後,木門緩緩打開。當它完全開啟的那一刻,小穹手中的包包掉到地上;艾米揉揉雙眼,確定自己看見的景象;婕兒的三魂七魄飛到了九霄雲外。