Coder Social home page Coder Social logo

onClick broken on iOS. about react HOT 19 CLOSED

leebyron avatar leebyron commented on December 12, 2024
onClick broken on iOS.

from react.

Comments (19)

rboyce avatar rboyce commented on December 12, 2024 3

* {cursor: pointer;} is the least offensive way to do this, IMO

from react.

tiaaaa123 avatar tiaaaa123 commented on December 12, 2024 1

react: 15.1.0 Still not working. I have the cursor: pointer as you can see. I tried onTouchStart, onTouchTap and onClick but none is happening.

alert('hi')} onTouchTap={() => alert('hi')} onClick={() => alert('hi')} style={{ padding: '16px', color: 'black', fontSize: '25px', cursor: 'pointer' }}> Click me!

When I'm on my website on an IPad and and my laptop the click on the IPad does nothing on the IPad, but it does on PC! The even seems to be triggered, but nothing is displayed on IPad....

from react.

yungsters avatar yungsters commented on December 12, 2024

Is this only an issue with iOS4 and below? Can we just generate markup for every node with onclick="" on the affected browsers?

from react.

leebyron avatar leebyron commented on December 12, 2024

I think it affects modern iOS browsers as well.

from react.

leebyron avatar leebyron commented on December 12, 2024

style="cursor:pointer" also fixes this :)

from react.

vjeux avatar vjeux commented on December 12, 2024

Does it only happens for onClick or also for onTouchStart, onDblClick ...?

Does attaching an onClick event listener to the dom node fixes the issue?

Christopher "vjeux" Chedeau
Facebook Engineer
http://blog.vjeux.com/

On Jun 27, 2013, at 10:45 PM, Lee Byron [email protected] wrote:

style="cursor:pointer" also fixes this :)


Reply to this email directly or view it on GitHub.

from react.

tomocchino avatar tomocchino commented on December 12, 2024

I think this is fixed now, right @zpao @yungsters?

from react.

ewendel avatar ewendel commented on December 12, 2024

Still not fixed, I just spent an hour trying to figure out why this wasnt working..

from react.

sophiebits avatar sophiebits commented on December 12, 2024

Sorry about that -- we have #1169 open now.

from react.

mietek avatar mietek commented on December 12, 2024

This is still an issue in 0.13.3.

from react.

sophiebits avatar sophiebits commented on December 12, 2024

It's fixed in 0.14 beta and will be in the final 0.14 as well.

from react.

shuson avatar shuson commented on December 12, 2024

The <a> without href attribute but with onClick event doing the navigation is not working across all kinds of browsers in iOS platform. (I test 4 of them in iOS 8.4.1 :)
But if we put a styling cursor:pointer for <a>, it will bypass iOS' restriction of the press and hold copy and paste text mechanics.

from react.

yagudaev avatar yagudaev commented on December 12, 2024

Just had the same problem with an onClick event on an overlay that was suppose to dismiss a menu when clicked or tapped. Changing the style to cursor: pointer like @shuson said worked, but it shouldn't be required.

from react.

sophiebits avatar sophiebits commented on December 12, 2024

As I said, this is fixed in 0.14 which will be released soon.

from react.

uzarubin avatar uzarubin commented on December 12, 2024

We are currently having this issue only on iOS 9. The workarounds work for other versions of iOS, just not the most recent one. Is anyone else experiencing this?

from react.

sophiebits avatar sophiebits commented on December 12, 2024

@uzarubin Haven't heard of this. I just tested with http://react.jsbin.com/vovuzexiza/edit?html,js (http://react.jsbin.com/vovuzexiza) and it seems to work fine.

from react.

melbayad avatar melbayad commented on December 12, 2024

I'm currently using React v0.14.0 and still have the same issue (event click not firing) on Safari v8.0.6 and IE. I've added cursor:pointer but with no luck. can you please help me to make it work ?

from react.

sophiebits avatar sophiebits commented on December 12, 2024

This issue has been fixed. If you're seeing the wrong behavior from React still, please open a new issue with a minimal repro case.

from react.

stresslimit avatar stresslimit commented on December 12, 2024

I love that this was still relevant to me today, thank you internet archives!

from react.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.