js模拟点击以提交表单为例兼容主流浏览器

在实际的应用开发中，我们会常常用到JS的模事件，但有时会遇到一些问题，比如说点击事件，举个简单的例子，点击表单外的“提交”按钮来提交表单。上代码吧。

Html:

复制代码 代码如下:

<h3>请单击“提交”，测试提交按钮的单击事件也被触发了。</h3>
<button>提交</button>
<form action="#" method="get">
<input type="text" value="www.woiweb.net" readonly/>
<input type="submit" value="先别点击此按钮提交"/>
</form>

复制代码 代码如下:

<script type="text/javascript">
var sub = document.getElementById("subbtn");
var btn = document.getElementById("btn");
//通用方法
btn.onclick = function() {
sub.click();
}
</script>

复制代码 代码如下:

<h3>请单击“提交”，测试提交按钮的单击事件也被触发了。</h3>
<button>提交</button>
<form action="#" method="get">
<input type="text" value="www.woiweb.net" readonly/>
<!--<input type="submit" value="先别点击此按钮提交"/> -->
<a href="javascript:;">模拟提交按钮</a>
</form>

复制代码 代码如下:

<script type="text/javascript">
var sub = document.getElementById("subbtn");
var btn = document.getElementById("btn");
//通用方法
btn.onclick = function() {
sub.click();
}
</script>

复制代码 代码如下:

<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>