1 line
4.1 KiB
JSON
1 line
4.1 KiB
JSON
{"name":"submit","type":"method","title":".submit()","deprecated":null,"removed":null,"desc":"Bind an event handler to the \"submit\" JavaScript event, or trigger that event on an element.","categories":["events/form-events","forms","version/1.0","version/1.4.3"],"entries":[{"return":"jQuery","signatures":[{"added":"1.0","argument":{"desc":"A function to execute each time the event is triggered.","name":"handler(eventObject)","type":"Function"}},{"added":"1.4.3","argument":[{"desc":"An object containing data that will be passed to the event handler.","name":"eventData","type":"PlainObject","optional":"true"},{"desc":"A function to execute each time the event is triggered.","name":"handler(eventObject)","type":"Function"}]},{"added":"1.0"}],"examples":[{"desc":"If you'd like to prevent forms from being submitted unless a flag variable is set, try:","code":"\n$( \"form\" ).submit(function( event ) {\n if ( $( \"input:first\" ).val() === \"correct\" ) {\n $( \"span\" ).text( \"Validated...\" ).show();\n return;\n }\n\n $( \"span\" ).text( \"Not valid!\" ).show().fadeOut( 1000 );\n event.preventDefault();\n});\n","css":"\n p {\n margin: 0;\n color: blue;\n }\n div,p {\n margin-left: 10px;\n }\n span {\n color: red;\n }\n","html":"\n<p>Type 'correct' to validate.</p>\n<form action=\"javascript:alert( 'success!' );\">\n <div>\n <input type=\"text\">\n <input type=\"submit\">\n </div>\n</form>\n<span></span>\n"},{"desc":"If you'd like to prevent forms from being submitted unless a flag variable is set, try:","code":"\n$( \"form\" ).submit(function() {\n return this.some_flag_variable;\n});\n"},{"desc":"To trigger the submit event on the first form on the page, try:","code":"\n$( \"form:first\" ).submit();\n"}],"longdesc":"\n <p>This method is a shortcut for <code>.on( \"submit\", handler )</code> in the first variation, and <code>.trigger( \"submit\" )</code> in the third.</p>\n <p>The <code>submit</code> event is sent to an element when the user is attempting to submit a form. It can only be attached to <code><form></code> elements. Forms can be submitted either by clicking an explicit <code><input type=\"submit\"></code>, <code><input type=\"image\"></code>, or <code><button type=\"submit\"></code>, or by pressing <kbd>Enter</kbd> when certain form elements have focus.</p>\n <div class=\"warning\">\n <p>Depending on the browser, the Enter key may only cause a form submission if the form has exactly one text field, or only when there is a submit button present. The interface should not rely on a particular behavior for this key unless the issue is forced by observing the keypress event for presses of the Enter key.</p>\n </div>\n <p>For example, consider the HTML:</p>\n <pre><code>\n<form id=\"target\" action=\"destination.html\">\n <input type=\"text\" value=\"Hello there\">\n <input type=\"submit\" value=\"Go\">\n</form>\n<div id=\"other\">\n Trigger the handler\n</div></code></pre>\n <p>The event handler can be bound to the form:</p>\n <pre><code>\n$( \"#target\" ).submit(function( event ) {\n alert( \"Handler for .submit() called.\" );\n event.preventDefault();\n});\n </code></pre>\n <p>Now when the form is submitted, the message is alerted. This happens prior to the actual submission, so we can cancel the submit action by calling <code>.preventDefault()</code> on the event object or by returning <code>false</code> from our handler. We can trigger the event manually when another element is clicked:</p>\n <pre><code>\n$( \"#other\" ).click(function() {\n $( \"#target\" ).submit();\n});\n </code></pre>\n <p>After this code executes, clicks on <samp>Trigger the handler</samp> will also display the message. In addition, the default <code>submit</code> action on the form will be fired, so the form will be submitted.</p>\n <p>The JavaScript <code>submit</code> event does not bubble in Internet Explorer. However, scripts that rely on event delegation with the <code>submit</code> event will work consistently across browsers as of jQuery 1.4, which has normalized the event's behavior. </p>\n "}]} |