StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>It looks like you got very close to the correct solution, but got tripped up by a minor detail.</p> <p>Your third example should have worked, </p> <pre><code>$('container').on('submit','#formname', function(){}) </code></pre> <p>but <code>container</code> probably should have been <code>'.container'</code> or <code>'#container'</code>, or even just <code>document</code> as <code>'container'</code> would select a HTML element of type container.</p> <p>Try this for a class named container:</p> <pre><code>$('.container').on('submit','#formname', function(){}) </code></pre> <p>or this for an id of container:</p> <pre><code>$('#container').on('submit','#formname', function(){}) </code></pre> <p>Or just use the document object (not a selector, hence no quotes)</p> <pre><code>$(document).on('submit','#formname', function(){}) </code></pre> <p>Or use the body element:</p> <pre><code>$('body').on('submit','#formname', function(){}) </code></pre> <p>Basically the deferred syntax of <code>on</code> binds to an element that will stick around for the life of the page, listening for the chosen event, and <em>then</em> selecting the target element via the selector supplied in the second parameter.</p> <p><strong>Update:</strong> Due to a bug related to styling using <code>'body'</code> in delegated events is a bad idea. Your default should be <code>document</code> if nothing else is closer/convenient. The problem stems from a possible styling issue, where the <code>body</code> element gets a computed height of <code>0</code> and does not receive any mouse events. <code>'body'</code> will likely work with <code>submit</code> events in that instance, but <code>document</code> is a safer "default" for <em>all</em> cases :)</p>

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