How to check browser for touchstart support using JS/jQuery?

Alex picture Alex · May 26, 2010 · Viewed 68.9k times · Source

In an attempt to follow best practices, we're trying to use the proper JavaScript/jQuery events according to what device you are using. For example, we're building a mobile site that has an tag that will have an onclick or touch event. In the case of an iPhone, we'd like to use the "touchstart" event. We'd like to test if their device supports "touchstart" before we bind that handler to the object. If it doesn't, then we will bind "onclick" instead.

What is the best way to do this?

Answer

Christian C. Salvadó picture Christian C. Salvadó · May 26, 2010

You can detect if the event is supported by:

if ('ontouchstart' in document.documentElement) {
  //...
}

Give a look to this article:

The isEventSupported function published there, is really good at detecting a wide variety of events, and it's cross-browser.