0

I'm developping a complex Single-Page-Application using ReactJS.

This page was initially a desktop browser application with lots of "onclick" listeners everywhere, including internal code, but also external plugins/libs that we can't modify easily.

But now we made it responsive, and it is available in both a mobile website and a Cordova/Phonegap app.

Just making the CSS responsive produces a nice result, without introducing touchstart event at all.

When the user touch an element with a click listener, the listener is called and the click event bubbles correctly (except on iOS but it can be solved)

So, unless I'm trying to implement touch specific complex features like drag&drop with touch, or special "synthetic events" like press, pinch, tap, swipe, (often provided by mobile-specific libraries), why would I need to use touchstart in any way?

For example I often see people trying to mix both click and touchstart in applications according to the device capabilities.

But if click works, why would I need to care about touchstart?

What are the advantages of touchstart that are not handled by click already?

Note: this is NOT at all about the 300ms click delay which can be solved in other ways.

Community
  • 1
  • 1
Sebastien Lorber
  • 89,644
  • 67
  • 288
  • 419

1 Answers1

0

The only reason we use touchstart/touchmove are for drag events, such as scrolling/inner-scolling detection.

For example, we want to detect the end of a scroll for infinite scroll.

On desktop we can use: 

$('.whatever').scroll({ blahhhh

but on mobile we use:

$('.whatever').on('touchmove', blahhhh

Also you should definitely checkout How to bind 'touchstart' and 'click' events but not respond to both?

Community
  • 1
  • 1
Lottamus
  • 457
  • 4
  • 7