Question

I have a standard text input that has a blur event. The blur event should fire when anything in the document is clicked (other than the input AND <div id='show-anyways'></div>).

My problem is that I don’t know how to add the <div id='show-anyways'></div> to negate the blur event function.

Hopefully I have explained myself well enough, I know it’s kinda a weird situation. Please let me know if you need more info.

Answer 1

Use the event target to determine what is clicked. Following will track all clicks on document and not trigger blur() if element is the DIV or the Input.

var $input=$( '#MY-Input-ID');

$(document).click(function(evt){
   var $tgt=$(evt.target);
   if( !$tgt.is( '#show-anyways') && !$tgt.is($input) ){
         $input.blur()
    }
})

It will not trigger on elements that have any preventPropogation set up.