CODEWITHSUNDEEP
javascriptiosmacossafariclick
Mark
Mark

Reputation: 2435

Click event listener works in Safari in OSX but not in iOS

I'm making a web app and I want to click on an element and handle the click in one long click event handler. I'm testing in Safari. The following works fine in Safari on my Mac but not in iOS:

<html>
    <head>
        <script>
            window.addEventListener("click",function (event) {
                alert('hi');
            });
        </script>
    </head>
    <body>
        <div style="width: 100%; height: 100%; background: black;">
        </div>
    </body>
</html>

Why does this work in the OSX version of Safari but not in iOS?

Upvotes: 7

Views: 13517

Answers (4)

mcmimik
mcmimik

Reputation: 1813

In my case I just needed to replace window to document:

Doesn't work on iOS:

window.addEventListener('click', () => {})

iOS compatible:

document.addEventListener('click', () => {})`

Upvotes: 2

Mark
Mark

Reputation: 2435

I found a very simple solution. I put another div about the div element in my sample code (see my question above). The opening div tag is

<div onClick="">

All divs inside this div tag will now trigger the click event. This also works with touchstart.

Upvotes: 0

Chaitanya Munipalle
Chaitanya Munipalle

Reputation: 724

Try changing the event listener "click" to "click touchstart"

Upvotes: 1

Konstantin Dinev
Konstantin Dinev

Reputation: 34895

This code should work cross-browser:

function Subscribe(event, element, func) {
    if (element.addEventListener) {
        element.addEventListener(event, func, false);
    } else if (element.attachEvent) {
        element.attachEvent("on" + event, func);
    } else {
        element['on' + event] = func;
    }
}

function func () {
    alert('hi');
}

Subscribe('click', window, func);

Upvotes: 3

Related Questions