CODEWITHSUNDEEP
javascriptjqueryinternet-explorer
ultraloveninja
ultraloveninja

Reputation: 2139

jQuery click event not working in IE11 Windows8

Not sure why this wouldn't work, but for some reason, the click event is firing a console.log but then it's not executing the addClass to the HTML element I'm trying to target. Not sure if there is anything that I need to look out for. I've tested this in Chrome on my Mac and it works fine, but then when I test on a Surface running Windows8, no dice.

Here's what I have:

HTML:

<div class="window-element">
<p>thing to test</p>
<a href="#" class="close-box">Close this</a>
</div>

JS:

$(".close-box").on('click', function(e){
    $(".window-element").addClass("hidden");
    console.log("click test");
    e.preventDefault();
});

Not sure if there is anything else that I need to work around with?

Upvotes: 1

Views: 156

Answers (2)

King11
King11

Reputation: 1229

To make as a minimum change as possible I would change your JS to:

$(document).on('click','.close-box', function(e){
    $('.window-element').addClass('hidden');
    console.log("click test");
    e.preventDefault();
});

This seemed to work for me. Try out this jsfiddle to see if this is what you're looking for: https://jsfiddle.net/91myczwj/1/

Upvotes: 1

Manuel Abascal
Manuel Abascal

Reputation: 6366

I would suggest you to use vanilla JavaScript for this particular code snippet like so:

HTML:

<div class="window-element">
<p>thing to test</p>
<a href="#" class="close-box">Close this</a>
</div>

JavaScript:

const closeBox = document.querySelector('.close-box');
const windowElement = document.querySelector('.window-element');

closeBox.addEventListener('click', function(e){
    windowElement.classList.add("hidden");
    console.log("click test");
    e.preventDefault();
});

Check this working code sample.

Upvotes: 0

Related Questions