【JavaScript】
タッチ可能なデバイスかどうかを判定する方法(旧Edge, IE対応版も紹介)

やりたいこと

目次

• タッチ可能かどうかを判定する
• 旧IE, Edgeに対応するには
• まとめ
• 参考文献・おすすめ文献
• 関連記事

タッチ可能かどうかを判定する

if(navigator.maxTouchPoints > 0){
    //タッチ可能
}else{
    //タッチ不可能
}

こちらは、現在のデバイスで対応している同時タッチ接触点の最大数を返します。

そのため、マウスでしか操作ができないPCでは0を返し、スマホやタッチ可能なPC(Surfaceなど)では1以上を返すようになっています。

これにより、タッチ可能なデバイスなのかどうかが判定できます。

旧IE, Edgeに対応するには

さて、この記事を書いている2025年時点では、先ほど紹介した方法で正しく動作するでしょう。

ここからは、旧IE, Edgeなどに対応する方法について解説します。

前項で紹介したnavigator.maxTouchPointsは、比較的新しいもので、一部の古い環境では正しく判定できません。

そこで、別の方法を使ってタッチ可能なデバイスかどうかを判定する方法を紹介します。

'ontouchstart' in windowとnavigator.msMaxTouchPointsを使用します。

if('ontouchstart' in window || navigator.msMaxTouchPoints > 0){
    //タッチ可能
}else{
    //タッチ不可能
}

'ontouchstart' in window は、主に古いEdgeやIEでタッチ可能かどうかを判定する際に使用します。

navigator.msMaxTouchPoints は、IE向けに使用します。

ただし、navigator.msMaxTouchPointsについてMicrosoftのドキュメントを見つけることができませんでした。

代わりにIntelが2014年ごろに公開したPDF資料の20ページ目で使用しているのを確認することができました。

Intel - Touch Developer Guide for Ultra Mobile Devices

ご参考までに。。

まとめ

タッチ可能なデバイスかどうかは、navigator.maxTouchPoints > 0 を使って判定する。

参考文献・おすすめ文献

mozilla - Element: touchstart

mozilla - Navigator: maxTouchPoints

Intel - Touch Developer Guide for Ultra Mobile Devices