Fixed matte background under iOS cannot be monitored dynamically, workaround

Scene: When you want to pop up a fixed dialog box (which is a popup box), and add a mask layer to the background, you want to click the mask layer to close the entire pop-up box when you're done.
The mask layer of the conditional 1:fixed is created dynamically and cannot be monitored using the Click event
Condition 2: There are links or elements that cannot be clicked under the mask (or there are actions or links to jump, etc.)

For condition 1, use jquery's on to listen to the entire document, and then perform the appropriate action when bubbling over the specified element

For condition 2, using Touchstart/touchend, a point-through problem is created

My experience and solutions:

1. Use jquery's delegate method to monitor the Click event

2, the use of advice from StackOverflow

On IOS There is no event bubbling without a cursor style. Your CSS need to add cursor:pointer; to the element.

Therefore, the final solution is to use delegate to dynamically listen for click events and add styles to the mask layer Cursor:pointer

If you do not want a black layer when clicked, the global setting *{-webkit-tap-highlight-color:rgba (0,0,0,0) "*" represents the element that you do not want the shadow layer to appear on.

Fixed matte background under iOS cannot be monitored dynamically, workaround