Kalan's Blog

Kalan 頭像照片,在淡水拍攝,淺藍背景

四零二曜日電子報上線啦!訂閱訂起來

本部落主要是關於前端、軟體開發以及我在日本的生活,也會寫一些對時事的觀察和雜感
本部落格支援 RSS feed(全文章內容),可點擊下方 RSS 連結或透過第三方服務設定。若技術文章裡有程式碼語法等特殊樣式,仍建議至原網站瀏覽以獲得最佳體驗。

目前主題 亮色

我會把一些不成文的筆記或是最近的生活雜感放在短筆記,如果有興趣的話可以來看看唷!

iOS mousedown 事件觸發問題

iOS 在某些版本下 mousedown 處理器不會正確運作,不過在其他裝置上(像 Android 等等),mousedown 仍然是可以正確運作的。

解決方法是在手機上不要用 mousedown 處理器,用 touchStart 來處理,但不知道觸發順序是否會受到影響?原本在 click 事件當中,是 blur 會先觸發(如果有)再觸發 click 事件,為了躲掉這個點才用 mousedown 取代。

在 codepen 上進行簡單的實驗:

See the Pen touchstart-test by 愷開 (@kjj6198) on CodePen.

可以發現觸發順序會是 touchstart > mousedown > blur,看來如果同時加入 touchstart 跟 mousedown 事件,在兩個事件都支援的情況下,兩個事件會按照 touchstart > mousedown 的順序發生?

網路上查了一下,發現是 iOS<13 時,mousedown 事件才不會被觸發,iOS 13 以後是正常運作。另外如果是 iPad 的話似乎還可以判斷 touch 是來自手指還是 apple pencil。

結論

  • iOS 做 mousedown 之類的綁定時要小心,盡量用 touch 系的事件取代。
  • iOS13 跟 iOS<13 是個分界點,要另外做測試。

先在這裡記錄一下,之後再把詳細行為一一補上。

上一篇

將數字加上 comma 的正規表達式說明

下一篇

站在中間的那群人 / 做出選擇的那群人

如果覺得這篇文章對你有幫助的話,可以考慮到下面的連結請我喝一杯 ☕️ 可以讓我平凡的一天變得閃閃發光 ✨

Buy me a coffee