JavaScript

$(this) and event.target

$(this) and event.target in on events binding: what’s the difference?

$(this) is always the dom being bind the event, e.g. in

$('#panel').on('hover', '.thumb-box', function(e) {
    console.log($(this));
    console.log(e.target);
});

$(this) is always the $('.thumb-box') being clicked.

event.target is the dom triggering the event–it could be another DOM .trigger('click') ing the event.

Q: What’s the use of the difference?

Could be used to stop click events triggering each other. Check e.event and you’ll know if it’s the guy you wanted who caused the chaos.

Alternatively if you want to tell if the event is triggered or not, the simplest way is to check event.isTrigger.

Or you could pass an object with trigger() if you prefer to.

$('.xx').click(function(e, isTriggered){
    console.log(isTriggered);
});

$('.checkbox').trigger('click', [true]);
Standard