從onSubmit事件處理程序添加或減去函數？

Question

我有以下代碼：

function showAddrBox() {
    var prompt = document.getElementById('addr_prompt');
    prompt.style.display = 'block';
    document.generic_form.address.style.display = 'block';
    document.generic_form.onsubmit = validateAddrForm;
}

function hideAddrBox() {
    var prompt = document.getElementById('addr_prompt');
    prompt.style.display = 'none';
    document.generic_form.address.style.display = 'none';
    document.generic_form.onsubmit = null;
}

問題是，有時候我想要保留onSubmit附加的附加功能。 我希望能夠在onSubmit事件中添加和刪除單個函數，而不只是使用“onsubmit =”設置它們。 換句話說，我需要一種方法來完成這樣的事情：

document.form.onsubmit += function;
document.form.onsubmit -= function;

有任何想法嗎？

Answer 1

Quirksmode有一篇關於高級事件注冊的精彩文章 。

簡寫形式是：您可以使用addEventListener （舊版IE中的attachEvent綁定多個事件。

if (someform.addEventListener) {
  someform.addEventListener('submit', somefunc, false);
} else {
  someform.attachEvent('onsubmit', somefunc);
}

要刪除它們，可以分別使用removeEventListener和detachEvent 。

---

很快就會因重復輸入addEventListener和attachEvent而煩惱，你可能會考慮制作一些通用代碼來為你綁定事件。 幸運的是，其他程序員也有同樣的想法，並且有許多庫可以優雅地處理事件管理。 jQuery往往是首選的庫，因為綁定事件非常簡單：

$('#formid').submit(somefunc);

通用事件綁定方法是：

$('#formid').on('submit', somefunc);

取消綁定你可以使用：

$('#formid').off('submit', somefunc);

雖然所有這些都在jQuery API中有詳細記錄 。

Answer 2

使用element.addEventListener("eventName", callbackFunction, false)和element.removeEventListener("eventName", callbackFunction) 。

其中eventName是沒有'on'的處理程序的名稱。 所以onsubmit變成提交。

有關這兩個函數的文檔，請參閱：

• https://developer.mozilla.org/en/DOM/element.addEventListener
• https://developer.mozilla.org/en/DOM/element.removeEventListener

Answer 3

我要做的是在表單上有一個onSubmit函數，它編排其余的函數，執行什么時候做什么的邏輯。 在該函數執行結束時，如果要繼續提交，則返回true，否則返回false。

Answer 4

你可以為下面的表格提及兩個或更多功能。

<form name="formaname" onsubmit="function1(),function2()">

更多關於onsubmit