方法一:HTMLElement.click()
HTMLElement.click()
,参考:https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/click , 比如a.click()
,此方法最简单最方便,基本上没什么兼容性问题(IE5.5+,Chrome9+):
特殊情况:js触发input[file]的单击事件
原文写于:2014-06-18
想要通过ele.click()
触发某个input[file]
的click事件,直接执行不会有效果(包括直接在控制台执行代码或者计时器延时调用均不生效),但是放到某个a标签或者按钮的单击事件上却有效!也就是说必须用户主动去单击某个东西才能触发文本框的单击事件。
演示:A标签直接打开文件窗口:
<input id="test" type="file" style="display:none;"/>
<a href="javascript:browse();">浏览</a>
<script type="text/javascript">
function browse()
{
document.getElementById('test').click();
}
</script>
备注:后面提到的方法二也无法直接控制台唤起file对话框,只能用户主动触发才可以。
方法二
通过MouseEvent来触发单击事件,具体兼容性也没有测试,但理论上比上面的好:
/**
* 考虑兼容性的触发单击事件
* @param elem 要触发单击事件的DOM对象
*/
function fireClickEvent(elem)
{
var event;
if(window.MouseEvent) event = new MouseEvent('click');
else
{
event = document.createEvent('MouseEvents');
event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
}
elem.dispatchEvent(event);
}