StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p><strong>As of jQuery 1.7</strong> you should use <a href="https://api.jquery.com/on/#on-events-selector-data-handler" rel="noreferrer"><code>jQuery.fn.on</code></a>:</p> <pre><code>$(staticAncestors).on(eventName, dynamicChild, function() {}); </code></pre> <hr> <p><strong>Prior to this</strong>, the recommended approach was to use <a href="http://api.jquery.com/live" rel="noreferrer"><code>live()</code></a>: </p> <pre><code>$(selector).live( eventName, function(){} ); </code></pre> <p>However, <code>live()</code> was deprecated in 1.7 in favour of <code>on()</code>, and completely removed in 1.9. The <code>live()</code> signature:</p> <pre><code>$(selector).live( eventName, function(){} ); </code></pre> <p>... can be replaced with the following <a href="http://api.jquery.com/on/" rel="noreferrer"><code>on()</code></a> signature:</p> <pre><code>$(document).on( eventName, selector, function(){} ); </code></pre> <hr> <p>For example, if your page was dynamically creating elements with the class name <code>dosomething</code> you would bind the event to <strong>a parent which already exists</strong> (this is the nub of the problem here, you need something that exists to bind to, don't bind to the dynamic content), this can be (and the easiest option) is <code>document</code>. Though bear in mind <a href="https://stackoverflow.com/questions/12824549/should-all-jquery-events-be-bound-to-document"><code>document</code> may not be the most efficient option</a>.</p> <pre><code>$(document).on('mouseover mouseout', '.dosomething', function(){ // what you want to happen when mouseover and mouseout // occurs on elements that match '.dosomething' }); </code></pre> <p>Any parent that exists at the time the event is bound is fine. For example</p> <pre><code>$('.buttons').on('click', 'button', function(){ // do something here }); </code></pre> <p>would apply to </p> <pre><code><div class="buttons">  </div> </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