Databases
StackOverflow2013
Postsdbo
POBlur element and it's parent element before element's blur handler runs?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POBlur element and it's parent element before element's blur handler runs?
    text
    copied!<p>With this HTML:</p> <pre><code>&lt;div id="SomeDiv"&gt; &lt;input id="SomeInput" /&gt; &lt;div id="ChildDiv"&gt;&lt;/div&gt; &lt;/div&gt; </code></pre> <p>I have an event handler assigned to the blur event for <code>SomeInput</code>. The blur event handler checks to see if <code>SomeDiv</code> or any of <code>SomeDiv</code>'s children still have focus, and aborts if any of them do (by design).</p> <p>The problem is, when I call blur() on <code>SomeInput</code> pragmatically, <code>SomeInput</code>'s blur event handler runs, but aborts because it thinks <code>SomeDiv</code> still has focus.</p> <p>I've tried explicitly blurring the input and the parent div, but the inputs handler still sees that parent as focused. I've also tried focusing and bluring the window and body elements, which doesn't seem to do anything.</p> <p>How can I blur <code>SomeInput</code>, <code>SomeDiv</code>, and <code>SomeDiv</code>'s children simultaneously, so when SomeInput's event handler runs, it does <em>not</em> see SomeDiv as focused?</p> <p>Event Handler:</p> <pre><code>this.eBlur = function(event,eventThis) { console.log(this.$element.attr('id')+' has lost focus.'); if(this.$element.has(":focus").length === 0){ console.log('widget does not have focus'); // do something. } else{ console.log('something is still focused, do nothing.'); } } var base = this; this.$input.bind('blur', function(e){base.eBlur(e,this);}); </code></pre> <p>Then to execute:</p> <pre><code>console.log('about to blur'); this.$input.blur(); // The blur handler runs immediately here console.log('blur complete'); </code></pre> <p>So the log reads:</p> <pre><code>about to blur this.$element.attr('id')+' has lost focus. something is still focused, do nothing. blur complete </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload