Javascript 模拟点击事件(点击链接与html点击) 兼容IE/Firefox

 更新时间:2010年01月02日 03:07:20   作者:  
Javascript 模拟点击事件,一般情况下ie支持的,firefox并不支持。所以可以通过下面的方法解决。

一把情况下模拟点击一般两个方面,模拟点击超级连接事件
firefox的兼容的函数为
对HTMLAnchorElement 加入onclick事件

复制代码 代码如下:

try {
// create a element so that HTMLAnchorElement is accessible
document.createElement('a');
HTMLElement.prototype.click = function () {
if (typeof this.onclick == 'function') {
if (this.onclick({type: 'click'}) && this.href)
window.open(this.href, this.target? this.target : '_self');
}
else if (this.href)
window.open(this.href, this.target? this.target : '_self');
};
}
catch (e) {
// alert('click method for HTMLAnchorElement couldn\'t be added');
}

下面是具体的应用

[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

如果是普通的html添加点击
这一段使得FireFox的HTMLElement具有click方法(add click method to HTMLElement in Mozilla)
复制代码 代码如下:

try {
// create span element so that HTMLElement is accessible
document.createElement('span');
HTMLElement.prototype.click = function () {
if (typeof this.onclick == 'function')
this.onclick({type: 'click'});
};
}
catch (e) {
// alert('click method for HTMLElement couldn\'t be added');
}

下面是网友的其它相关文章也可以参考下。
最近做东西发现用户在网页输入框里面按回车的行为是不固定的。。。
特别是在网页有多个表单的时候
于是搜了一把找了一个模拟点击的js,经测试能在firefox和ie上运行
复制代码 代码如下:

function doClick(linkId, e){
if(e.keyCode != 13){
return;
}
var fireOnThis = document.getElementById(linkId)
if (document.createEvent)
{
var evObj = document.createEvent('MouseEvents')
evObj.initEvent( 'click', true, false )
fireOnThis.dispatchEvent(evObj)
}
else if (document.createEventObject)
{
fireOnThis.fireEvent('onclick')
}
}

其中e是event,内置对象,linkId是模拟被点击的对象id
比如<INPUT id="test" onkeypress="doClick("buttonId", event)">
这样的话就能让用户按回车来提交表单了~
opera可以再改一下
复制代码 代码如下:

<img id="a" src="/a.jpg" onclick="alert('a');"/><div onclick="clickObj('a')">click me</div>
<script language="javascript">
<!--
function clickObj(o){
var o = document.getElementById(o);
if( document.all && typeof( document.all ) == "object" ) //IE
{
o.fireEvent("onclick");
}
else
{
var e = document.createEvent('MouseEvent');
e.initEvent('click',false,false);
o.dispatchEvent(e);
}
}
//-->
</script>

相关文章

  • 使用Javascript简单计算器

    使用Javascript简单计算器

    这篇文章主要为大家详细介绍了使用Javascript简单计算器,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-11-11
  • 基于mouseout和mouseover等类似事件的冒泡问题解决方法

    基于mouseout和mouseover等类似事件的冒泡问题解决方法

    这篇文章主要介绍了关于mouseout和mouseover等类似事件的冒泡问题解决方法。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • JavaScript中的this关键字介绍与使用实例

    JavaScript中的this关键字介绍与使用实例

    JavaScript其实一门基于或者说是面向对象的语言,这样的话,this这个关键字,在类的内部就显得尤为重要
    2013-06-06
  • js的for in循环和java里foreach循环的区别分析

    js的for in循环和java里foreach循环的区别分析

    这篇文章主要介绍了js的for in循环和java里foreach循环的区别,实例分析了js的for in循环使用技巧并说明了与Java中foreach循环的使用区别,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-01-01
  • Js调用Java方法并互相传参的简单实例

    Js调用Java方法并互相传参的简单实例

    下面小编就为大家带来一篇Js调用Java方法并互相传参的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-08-08
  • 企业微信扫码登录网页功能实现代码

    企业微信扫码登录网页功能实现代码

    这篇文章主要介绍了企业微信扫码登录网页功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-01-01
  • 一些老手都不一定知道的JavaScript技巧

    一些老手都不一定知道的JavaScript技巧

    这篇文章主要介绍了一些老手都不一定知道的JavaScript技巧,需要的朋友可以参考下
    2014-05-05
  • 原生js实现键盘控制div移动且解决停顿问题

    原生js实现键盘控制div移动且解决停顿问题

    这篇文章主要给大家介绍了如何利用原生js实现键盘控制div移动,并且解决在移动过程中的停顿问题,文中给出了详细的示例代码,相信对大家的理解和学习很有帮助,下面跟着小编一起来看看吧。
    2016-12-12
  • js实现点击选项置顶动画效果

    js实现点击选项置顶动画效果

    这篇文章主要为大家详细介绍了js实现点击选项置顶动画效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • js排序与重组的实例讲解

    js排序与重组的实例讲解

    下面小编就为大家带来一篇js排序与重组的实例讲解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-08-08

最新评论