Problem description
When a delegate is used to add an event to an element, the event click
is invalidated if the event is delegated to document
or body
on, and the element of the delegate is not clickable by default (such as div
, span
etc.) click
.
You can use the following code to test in IOS.
<! DOCTYPE html>
SolutionsThere are 4 solutions to choose from:
- ?
click
bind the event directly to the target? IE .target
) on
- Change the target element to
<a>
a clickable element button
?
- ?
click
delegate events to????? Non- document
or body
the?? On the parent element
- Add a style rule to the target element
cursor: pointer;
? recommend the latter two. From the perspective of the solution, it is speculated that in Safari, a click event of a non-clickable element does not bubble to the parent element. By adding, the cursor: pointer
element becomes clickable.
Workaround for Click event Invalidation in IOS Safari