ITTONE Création des applications Web

javascript – Arrow function has different functionality than function in click event?


I have an onclick event using JQuery. I want to overlay a div .new_question which has a form in it if a button is clicked. When the overlay is visible, if someone clicks the div area and NOT its children I want to hide the div. I am doing the following:

$('.new_question').click( (e) => {
        if (e.target !== this) {
            return;
        }
        $('.new_question').css({
            "visibility": "hidden",
            "height": "0vH",
            "width": "0vW"
        });
    })

This does not seem to be working, but replacing the arrow function with function keyword does

$('.new_question').click( function(e) => {
        if (e.target !== this) {
            return;
        }
        $('.new_question').css({
            "visibility": "hidden",
            "height": "0vH",
            "width": "0vW"
        });
    })

Could anyone explain what is the difference here and why the function version works, but the arrow function does not?

Canadian Web HostingAvaHost.Net Web Hosting

Product of the Month September 2016

Source link

Leave a Comment

Your email address will not be published. Required fields are marked *