概述 .submit( handler(eventObject) )
返回值:jQuery
描述:为 JavaScript 的 "submit" 事件绑定一个处理函数,或者触发元素上的该事件。
这个函数的前两个用法是 .bind('submit', handler)
的快捷方式,第3个不带参数的用法是 .trigger('submit')
的快捷方式。
当用户试图提交表单时,就会在这个表单元素上触发submit
事件。它只能绑定在<form>
元素上。以下几种情况会导致表单被提交:用户点击了<input type="submit">
, <input type="image">
, 或者 <button type="submit">
,或者当某些表单元素获取焦点时,敲击Enter(回车键),都可以提交。
根据不同的浏览器,Enter 键可能会导致表单被提交,如果这个表单只有一个文本框或只有一个 submit 按钮的话。界面不应该依赖于这个键的特殊行为,除非已经使用了 keypress 事件来监听 Enter 键的按下。
举例来说,请看下面的HTML:
- <form id="target" action="destination.html">
- <input type="text" value="Hello there" />
- <input type="submit" value="Go" />
- </form>
- <div id="other">
- Trigger the handler
- </div>
这个事件处理程序可以绑定到表单
- $('#target').submit(function() {
- alert('Handler for .submit() called.');
- return false;
- });
现在当表单提交时,警告将被显示。出现这种情况的实际提交之前,所以我们可以通过调用事件对象的.preventDefault()
或在处理函数中返回 false
来取消提交:
- $('#other').click(function() {
- $('#target').submit();
- });
这些代码执行后,点击Trigger the handler 同样会警报显示。此外,默认的submit
表单上的动作上会被触发,所以表格将被提交。
在Internet Explorer中,JavaScript的submit
事件不会泡沫。但是,依赖 submit
事件代理的脚本,从 jQuery 1.4 开始,可以跨浏览器正常使用。
submit
, length
, 或 method
。名称冲突可能会导致混乱的失败。对于一个完整的规则列表,并检查这些问题标记。
.submit()
方法只是作为.on( "submit", handler )
的一个速记写法,移除该事件可以使用.off(
"submit"
)
。
示例
如果你想根据一个标识来阻止表单被提交的话,可以像下面这样做:
- <!DOCTYPE html>
- <html>
- <head>
- <style>
-
- p { margin:0; color:blue; }
- div,p { margin-left:10px; }
- span { color:red; }
- </style>
- <script src="http://code.jquery.com/jquery-latest.js"></script>
- </head>
- <body>
- <p>Type 'correct' to validate.</p>
- <form action="javascript:alert('success!');">
- <div>
- <input type="text" />
-
- <input type="submit" />
- </div>
- </form>
- <span></span>
- <script>
-
- $("form").submit(function() {
- if ($("input:first").val() == "correct") {
- $("span").text("Validated...").show();
- return true;
- }
- $("span").text("Not valid!").show().fadeOut(1000);
- return false;
- });
- </script>
-
- </body>
- </html>
如果你想根据一个标识来阻止表单被提交的话,可以像下面这样做:
- $("form").submit( function () {
- return this.some_flag_variable;
- } );
触发页面上第一个表单的提交事件:
- $("form:first").submit();