简体   繁体   中英

Click-event does not always propagate to document.body on mobile devices

On mobile devices when you tap on an element, a click event is fired. However, it doesn't always travel up to document.body .

<body>
    <div class="with-click"></div>
</body>

document.querySelector('.with-click').addEventListener('click', (e) => ...);

document.body.addEventListener('click', (e) => ...);

demo .

Now, when you click outside the div nothing happens on the body but when you click inside the div the body receives the click event. If you, for example, remove the click listener from that div ( DEMO ) the click is no longer received.

Is this normal behaviour? and can this be fixed?

Change document.body.addEventListener to just document.addEventListener("click", ...) .

I have verified that this solves the problem on iOS using this Fiddle .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM