.submit()
.submit( handler(eventObject) ) 返回: jQuery
描述L: 為 "submit" 事件綁定一個(gè)處理函數(shù),或者觸發(fā)元素上的 "submit" 事件。
-
version added: 1.0.submit( handler(eventObject) )
handler(eventObject)每次事件觸發(fā)時(shí)會(huì)執(zhí)行的函數(shù)。
-
version added: 1.4.3.submit( [ eventData ], handler(eventObject) )
eventData將要傳遞給事件處理函數(shù)的數(shù)據(jù)映射。
handler(eventObject)每次事件觸發(fā)時(shí)會(huì)執(zhí)行的函數(shù)。
version added: 1.0.submit()
這個(gè)函數(shù)的第一種用法是 .bind('submit', handler) 的快捷方式,第二種用法是 .trigger('submit') 的快捷方式。
當(dāng)用戶試圖提交表單時(shí),submit事件將被發(fā)送到一個(gè)元素。它只能附加在<form>元素。表單可以通過(guò)點(diǎn)擊一個(gè)明確的<input type="submit">, <input type="image">, 或者 <button type="submit">,或者當(dāng)某些表單元素獲取焦點(diǎn)時(shí)敲擊Enter(回車鍵),都可以提交。
根據(jù)不同的瀏覽器,如果表單只能有一個(gè)文本字段,回車鍵可能只會(huì)導(dǎo)致一個(gè)表單提交,或僅當(dāng)有一個(gè)當(dāng)前的提交按鈕。該接口不應(yīng)該依賴于一個(gè)特定的行為,除非這一關(guān)鍵問(wèn)題是通過(guò)觀察就按下回車鍵KeyPress事件被迫的。(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.)
舉例來(lái)說(shuō),請(qǐng)看下面的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>
這個(gè)事件處理程序可以綁定到表單
$('#target').submit(function() {
alert('Handler for .submit() called.');
return false;
});
現(xiàn)在當(dāng)表單提交時(shí),警告將被顯示。出現(xiàn)這種情況的實(shí)際提交之前,所以我們可以通過(guò)調(diào)用事件對(duì)象的.preventDefault()或在處理函數(shù)中返回 false 來(lái)取消提交:
$('#other').click(function() {
$('#target').submit();
});
這些代碼執(zhí)行后,點(diǎn)擊Trigger the handler 同樣會(huì)警報(bào)顯示。此外,默認(rèn)的submit表單上的動(dòng)作上會(huì)被觸發(fā),所以表格將被提交。
JavaScript的submit事件不會(huì)在Internet Explorer的泡沫。However, scripts that rely on event delegation with the submit event will work consistently across browsers as of jQuery 1.4, which has normalized the event's behavior.
Additional Notes:
- 表單及他們的子元素不應(yīng)該使元素名稱或ID屬性沖突,比如
submit,length, 或method。名稱沖突可能會(huì)導(dǎo)致混亂的失敗。對(duì)于一個(gè)完整的規(guī)則列表,并檢查這些問(wèn)題標(biāo)記,看DOMLint。
Examples:
Example: If you'd like to prevent forms from being submitted unless a flag variable is set, try:
<!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.min.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>
Demo:
Example: If you'd like to prevent forms from being submitted unless a flag variable is set, try:
$("form").submit( function () {
return this.some_flag_variable;
} );
Example: To trigger the submit event on the first form on the page, try:
$("form:first").submit();