StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p><strong>Update</strong></p> <p>In the comments, you say</p> <blockquote> <p>I need id other element, on which is mouse over now</p> </blockquote> <p>That's a different question. To do that, you'll want a combination of knowing the mouse has left the <code>div</code>, <strong>and</strong> knowing it's entered something else. I'd probably use a combination of <code>mouseleave</code> and <code>mouseover</code> for that, like this:</p> <pre><code>$("#div_1").mouseleave(function() { // We're leaving the div, set up to capture mouseover $("....selector for a container of these elements...").one("mouseover", function(e) { // Get the ID of the bottommost element console.log(e.target.id); // Or alternately, in case it doesn't have one var elementWithID = $(e.target).closest('[id]'); if (elementWithID[0]) { console.log(elementWithID[0].id); } }); }); </code></pre> <p>But I'd try really, really hard to come up with a different way to deliver the underlying requirement.</p> <hr> <p>Original answer:</p> <p>The short version:</p> <pre><code>$("#div_1").mouseout(function() { alert(this.id); // But I'd avoid alert if I were you, perhaps console.log? }); </code></pre> <p>But read on...</p> <p>The long version:</p> <p>When you set up an event handler with jQuery, when the handler is called, <code>this</code> is a reference to the DOM element you hooked the event on, and of course <code>id</code> is the reflected property for the <code>id</code> attribute.</p> <p>But remember that <code>mouseout</code> <em>bubbles</em>, so you'll receive the <code>mouseout</code> event any time the mouse leaves an element that's within your <code>div</code> (any of its descendants), even if it didn't leave the <code>div</code> itself. If you just want to know when it leaves the <code>div</code> but not any of its descendant elements, use <code>mouseleave</code> instead (originally IE-only, but jQuery provides it cross-browser).</p> <p>If you wanted to generalize that to, say, all divs with class <code>foo</code>:</p> <pre><code>$("div.foo").mouseout(function() { // Or, of course, mouseleav console.log(this.id); }); </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