iOSの一部のバージョンでは、mousedown
イベントハンドラが正常に動作しない場合がありますが、他のデバイス(Androidなど)ではmousedown
は正常に機能します。
解決策は、モバイルデバイスでmousedown
イベントハンドラを使用せず、touchStart
を使用することですが、トリガーの順序が影響を受けるかどうかはわかりません。元々は、クリックイベント内では、blur
が最初にトリガーされ(存在する場合)、その後にクリックイベントがトリガーされるようにしていましたが、この点を避けるためにmousedown
を使用しています。
簡単な実験をCodePenで行います:
See the Pen touchstart-test by 愷開 (@kjj6198) on CodePen.
トリガーの順序はtouchstart > mousedown > blur
となります。したがって、touchstart
とmousedown
の両方のイベントを同時に追加した場合、両方のイベントがサポートされている場合は、touchstart > mousedown
の順序で発生するようです。
インターネットで調べてみると、iOS 13以前ではmousedown
イベントがトリガーされないことがわかりました。また、iPadの場合、タッチが指から来たかApple Pencilから来たかを判別することもできるようです。
結論
iOS
でmousedown
などのバインディングを行う場合は注意が必要です。できるだけタッチ系のイベントを使用してください。- iOS 13とiOS 13以前は分岐点であり、別途テストが必要です。
ここに詳細な動作を記録しておきます。