在實際的應用程式開發中，我們會常常用到JS的模事件，但有時會遇到一些問題，比如說點擊事件，舉個簡單的例子，點擊表單外的「提交」按鈕來提交表單。上代碼吧。
Html:
複製代碼代碼如下:
<h3>請點擊“提交”，測試提交按鈕的點擊事件也被觸發了。 </h3>
<button id="btn">提交</button>
<form action="#" method="get" id="form">
<input type="text" name="site" value="www.woiweb.net" readonly/>
<input id="subbtn" type="submit" value="先別點擊此按鈕提交" onclick="alert('我已經提交了');"/>
</form>
Javscript:
複製代碼代碼如下:
<script type="text/javascript">
var sub = document.getElementById("subbtn");
var btn = document.getElementById("btn");
//通用方法
btn.onclick = function() {
sub.click();
}
</script>
經過測試，IE，FF，Chrome，Opera，Safari都沒有問題，均可正常提交表單。
但在實際的設計中，為了讓提交按鈕更好看，buildder經常把它們用a標籤來處理，加個背景圖片來模擬按鈕，我們仍然用上面的思路來嘗試，增加一個a標籤，讓它來提交表單，我們僅修改html。
Html:
複製代碼代碼如下:
<h3>請點擊“提交”，測試提交按鈕的點擊事件也被觸發了。 </h3>
<button id="btn">提交</button>
<form action="#" method="get" id="form">
<input type="text" name="site" value="www.woiweb.net" readonly/>
<!--<input id="subbtn" type="submit" value="先別點擊此按鈕提交" onclick="alert('我已經提交了');"/> -->
<a id="subbtn" href="javascript:;" onclick="alert('在此呼叫提交表單的方法')">模擬提交按鈕</a>
</form>
Javascript:
複製代碼代碼如下:
<script type="text/javascript">
var sub = document.getElementById("subbtn");
var btn = document.getElementById("btn");
//通用方法
btn.onclick = function() {
sub.click();
}
</script>
運行後，問題出現了，IE、FF、Opera均OK，但Chrome和Safari不能正常運行，後來網上搜索了下，發現a標籤並不是和按鈕一樣有onclick()事件的，解決辦法是針對IE 和FF編寫不同的邏輯，JS程式碼如下：
javascript:
複製代碼代碼如下:
<script type="text/javascript">
var sub = document.getElementById("subbtn");
var btn = document.getElementById("btn");
//通用方法
btn.onclick = function() {
//sub.click();
if (/msie/i.test(navigator.userAgent)) //IE
{
sub.fireEvent("onclick");
} else {
var e = document.createEvent('MouseEvent');
e.initEvent('click', false, false);
sub.dispatchEvent(e);
}
}
</script>
至此，問題解決，雖然這個問題很簡單，但很容易被大家忽略，貼出來跟大家分享。
文法:
createEvent(eventType)
參數描述
eventType 想要取得的Event 物件的事件模組名。關於有效的事件類型列表，請參閱”說明”部分。
傳回值
傳回新建立的Event 對象，具有指定的類型。
拋出
如果實作支援需要的事件類型，則該方法將拋出程式碼為NOT_SUPPORTED_ERR 的DOMException 例外。
說明
此方法將建立新的事件類型，該類型由參數eventType 指定。請注意，該參數的值不是要建立的事件介面的名稱，而是定義那個介面的DOM 模組的名稱。
下表列出了eventType 的合法值和每個值所建立的事件介面：
參數事件介面初始化方法
HTMLEvents HTMLEvent iniEvent()
MouseEvents MouseEvent iniMouseEvent()
UIEvents UIEvent iniUIEvent()
用此方法建立了Event 物件以後，必須用上表所示的初始化方法初始化物件。關於初始化方法的詳細信息，請參閱Event 物件參考。
這個方法實際上不是由Document 介面定義的，而是由DocumentEvent 介面定義的。如果一個實作支援Event 模組，那麼Document 物件就會實作DocumentEvent 介面並支援該方法。