Why does the event object need to be passed as a function argument in Firefox when using jQuery?

Question

JavaScript

Code example:

$('.block').click(function(){
        var is = $(this);

        if(!is.hasClass('active')){
            is.addClass('active')
            event.stopPropagation();
        }
    });

 On web-kit engines, everything works fine, it’s clear that the event is a global object, but it refuses to work in FireFox, but if you insert the event object into the argument of the anonymous function:

$('.block').click(function(event){
 // тут все работает
})

FireFox is up and running!

What can be wrong?

UPD: maybe it's because you need to specify event as window.event?

Answer 1

The first piece of code is not correct. The use of an uninitialized variable, or rather the use of the window.event variable, which may not be initialized. Whereas jQuery explicitly states the presence of the event parameter in the click callback , which is where the event object comes in.
So firefox, in this case, protected you from incorrect code. I think using use strict; in any browser would not allow you such liberties.

Answer 2

Place .main-item after .slider.active, change the order with flex and refer to it with a plus sign.
~ also works only on subsequent elements (and + only on the next one ) UPD https://jsfiddle.net/1whm1g4o/3/

Answer 3

Alternatively, you can set active not only to .slider, but also to .main-item or even to the parent li.