[精讚] [會員登入]
883

【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

你可能感興趣的文章

【C++】如何解決TLE,換句話說便是加速cin, cout的執行速度 [ZERO JUDGE](UVa) a159: 11743 - Credit Check 題目練習和副程式練習

【Javascript】(Event)常用的網頁事件 不寫下來絕對下又會忘記,然後每次又都要回到MDN去查,麻煩

【無料版模】﹝CSS&HTML﹞製作epub電子書版模免費下載&附使用教學 一個專門用來製作epub的簡單CSS檔案,基本上已經可以做出一本還不錯的電子書,讓妳的電子書不在只有預設的字體、樣式

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

【JAVA】[java.lang.Class]如何不透過new來實體化class 在某些極端狀態下,我們沒有辦法直接將實體化後的 Object 傳入函數內,只能採用傳入 Class 在實體化成物件這種極端的方式來進行

【Wickct】(link) <a> 如何新增超連結 簡單來說有兩種方式,小編個人比較偏好 的方法

隨機好文

希萌創意預計在今年7月繼東津萌米之後再次推出新遊戲--食用性少女! 今天來介紹希萌創意的心企劃案,來讓大家知道這個消息!讓大家的錢包君一起來減肥吧!Ψ(☆w☆)

高捷少女:小穹與果仁巧克力㊥ 艾咪臉上泛起笑容說:「妳知道嗎?就跟花語一樣,每一種巧克力也都有各自的涵義:薄荷巧克力代表初戀;卡通巧克力代表天真爛漫;而果仁巧克力代表的是窩心,還有想陪伴對方的心情,這在德國是女生之間在慶生時會彼此

高捷少女:耐耐的新年驚喜③ 即使如此,夫人仍然每年都會問老爺是否能空出一週時間,但總是被回絕,除了前年以外。老爺答應夫人一定會排出空檔,他們在去年的二十三日前往澳洲。」耐耐嘆了口氣。「那一天的晚上,我打電話給媽媽時,她很高興地告

婕兒──她的青春② 艾米直搖頭。「我真不敢相信,小穹妳都二十幾歲了,為什麼能想出這種故事呀?」「婕兒也是二十幾歲啊,妳想想她現在是什麼樣子?」小穹不滿地指向火車的方向。

婕兒──她的青春③ 「墮天使穹音!」婕兒拿出平底鍋。 耐耐憋著笑搖搖頭。「不是喔,她是我的……我的……」 「替身。」小穹小聲提醒忘記台詞的耐耐。