why it can't work on iphone

[petyou]

it can work on Android Wechat and chrome and so on ,but it cant't work on iphone Wechat, how to solve it

[boblauer]

Do you just mean it doesn't work on iphone browser in general?

[skywickenden]

I have the same problem. Tested on iPhone and iPad using both Safari and Chrome. It doesn't work on any. Works fine on android.

[skywickenden]

The problem is the click events. They also need to be touchstart events

    setTimeout(function() {
      if (self.__unmounted) return;
      window.addEventListener('click', self.__windowListener);
      window.addEventListener('touchstart', self.__windowListener);
      el.addEventListener('click', self.__elementListener);
      el.addEventListener('touchstart', self.__elementListener);
    }, 0);

Edit: also need to add the new handlers to the componentWillUnmount function

This is still not ideal as they will fire on drag as well as touch, but it is far better than not working.

[boblauer]

Thanks for pointing me in the right direction. As far as ignoring drag events, I'll probably listen to touchstart and touchend, and measure the pointer distance between the two. If it's less than some threshold, I will consider it a click, otherwise I'll consider it a drag and ignore it.

[skywickenden]

The way to go seems to be to detect touchstart, touchmove and touchend. But only fire the actual event if touchend fires and touchmove did not. See http://www.webdeveloper.com/forum/showthread.php?272103-onclick-not-working-on-iPhone

[boblauer]

I considered that as well, but wondered how sensitive the touchmove event is. I'll have to play around with it and see what works best.

[skywickenden]

If it helps I created a fork here using the touchmove method. It seems to work fine. (I only edited the compiled file and not the source one.)

[richardwillars]

Any chance of the above fix getting merged in?

[boblauer]

Yeah, sorry, I completely forgot about this. I will try to get this fixed by the end of this week.

[richardwillars]

Amazing, thanks :)

[fpanwaskar-hive]

Hi @boblauer any idea when you will be able to merge this in please? This would solve a bug for us, thanks in advance.

[boblauer]

This has been published, react-onclickout@2.0.7. If you see any issues on iOS, please let me know. I don't have an iOS device, so I could only test this inside of an iOS simulator.