using multiple events with the same function

Question

I'm making attempts to clean up my code. Just wondering if there's a way to write this code better? I've added a snippet of my code below:

$('.popUp-block').on("click",function() {
    $('.protect-field-container').removeClass('is-displayed');
    $(this).closest('.protect-field-container').addClass('is-displayed');
});

$('.popUp-block').hover(function() {
    $('.protect-field-container').removeClass('is-displayed');
    $(this).closest('.protect-field-container').addClass('is-displayed');
});

$('.popUp-block').focusout(function() {
    $('.protect-field-container').removeClass('is-displayed');
});

$('.popUp-block').on("mouseout", function() {
    $('.protect-field-container').removeClass('is-displayed');
});

Praveen Kumar Purushothaman · Accepted Answer · 2016-05-05 14:07:49Z

3

In simple way, you can do it with .on():

$('.popUp-block').on("click mouseover",function() {
  $('.protect-field-container').removeClass('is-displayed');
  $(this).closest('.protect-field-container').addClass('is-displayed');
});

$('.popUp-block').on("mouseout focusout", function() {
  $('.protect-field-container').removeClass('is-displayed');
});

From the docs:

One or more space-separated event types and optional namespaces, such as "click" or "keydown.myPlugin".

answered May 5, 2016 at 14:07

Praveen Kumar Purushothaman

167k27 gold badges215 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

using multiple events with the same function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related