JavaScript自动点击链接 防止绕过浏览器访问的方法


Posted in Javascript onJanuary 19, 2017

做支付宝帐号登录,需要做一个效果,就是打开链接页面的时候,不需要点击链接,直接跳到支付宝登录页面。也就是说,需要做一个自动点击链接的效果。

基本都是用这个:

<body onLoad="autoclick('auto')">

<a id='auto' href=".$url."><img border='0' src='images/alipaylog.gif' /></a>

</body>

<script type="text/javascript">


 function autoclick(){

 lnk = document.getElementById("auto");

 lnk.click();

  }

</script>

这个就IE下可以用,其它浏览器都不可以。还转得铺天盖地呢,浪费大家搜索的时间。

下面这个还比较靠谱,先看看吧:

<body onLoad="autoclick('auto')">

<a id='auto' href=".$url."><img border='0' src='images/alipaylog.gif' /></a>

</body>

<script type="text/javascript">  1: 

function autoclick(name)

{  

  if(document.all)  

  {  

    //alert(1);

     document.getElementById(name).click();  

  }  

   else  

  {  

    var evt = document.createEvent("MouseEvents");  

      evt.initEvent("click", true, true);  

    //alert(2);

    document.getElementById(name).dispatchEvent(evt);  

   }  

} 

</script>

这个在Chrome和IE下都能正常,但是在Firefox下就不能了。但总比第一个要优秀。

dispatchEvent在Firefox下是有问题的,下面是解决方案:

document.getElementById("me").onclick = function() {

  var card = document.getElementById("card");

   if(document.createEvent){

    var ev = document.createEvent('HTMLEvents');

    ev.initEvent('click', false, true);

    card.dispatchEvent(ev);

   }

   else 

     card.click();
 }

其中 card元素是绑有事件的元素。me元素是想通过点击 me元素 来调用 card的click事件的元素。。。。

问题的重点在于 firefox 的js引擎需要先创建一个事件:var ev = document.createEvent('HTMLEvents');

然后将事件指定为 click事件:ev.initEvent('click', false, true);

最后将事件付给card元素:card.dispatchEvent(ev);

card = document.getElementById('id');

var ev = document.createEvent('HTMLEvents');

ev.initEvent('click', false, true);

card.dispatchEvent(ev);

由此可见,dispatchEvent 是事件委托中的最后一步,将委托事件与调用的元素链接起来,达到调用这个元素的事件的效果。

最后推荐用 input 来实现,下面是最终解决方案:

<body onLoad="autoclick('auto2')">

 <input id="auto2" type="hidden" onClick="javascript:location.href = '<?=$url?>' " />

</body>

<script type="text/javascript">  1: 

function autoclick(name)

 {  

  if(document.all)  

  {  

    //alert(1);

     document.getElementById(name).click();  

  }  

   else  

  {  

   var evt = document.createEvent("MouseEvents");  

     evt.initEvent("click", true, true);  

    //alert(2);

    document.getElementById(name).dispatchEvent(evt);  

   }  
} 
</script>

以上这篇JavaScript自动点击链接 防止绕过浏览器访问的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 学习之旅 (2)
Feb 05 Javascript
解析Jquery取得iframe中元素的几种方法
Jul 04 Javascript
图片翻转效果具体实现代码
Jan 09 Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
Nov 23 Javascript
JavaScript通过join函数连接数组里所有元素的方法
Mar 20 Javascript
Node.js操作Firebird数据库教程
Mar 04 Javascript
理解javascript模块化
Mar 28 Javascript
JS实现刷新父页面不弹出提示框的方法
Jun 22 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
Nov 16 Javascript
JS二叉树的简单实现方法示例
Apr 05 Javascript
Vue.extend 编程式插入组件的实现
Nov 18 Javascript
JS前端使用Canvas快速实现手势解锁特效
Sep 23 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
Jan 19 #Javascript
创建一般js对象的几种方式
Jan 19 #Javascript
用JavaScript实现让浏览器停止载入页面的方法
Jan 19 #Javascript
AngularJS使用ng-inlude指令加载页面失败的原因与解决方法
Jan 19 #Javascript
快速掌握jQuery插件开发
Jan 19 #Javascript
Web 开发中Ajax的Session 超时处理方法
Jan 19 #Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
Jan 19 #Javascript
You might like
php操作redis中的hash和zset类型数据的方法和代码例子
2014/07/05 PHP
详解YII关联查询
2016/01/10 PHP
php动态读取数据清除最右边距的方法
2017/04/12 PHP
PHP生成各种随机验证码的方法总结【附demo源码】
2017/06/05 PHP
PHP中的empty、isset、isnull的区别与使用实例
2019/03/22 PHP
PHP程序员必须知道的两种日志实例分析
2020/05/14 PHP
快速保存网页中所有图片的方法
2006/06/23 Javascript
js 模拟实现类似c#下的hashtable的简单功能代码
2010/01/24 Javascript
jQuery 常见操作实现方式和常用函数方法总结
2011/05/06 Javascript
JQuery中两个ul标签的li互相移动实现方法
2015/05/18 Javascript
如何屏蔽防止别的网站嵌入框架代码
2015/08/24 Javascript
轻松学习Javascript闭包函数
2015/12/15 Javascript
checkbox 选中一个另一个checkbox也会选中的实现代码
2016/07/09 Javascript
基于Vuejs实现购物车功能
2016/08/02 Javascript
基于JS如何实现给字符加千分符(65,541,694,158)
2016/08/03 Javascript
JavaScript版经典游戏之扫雷游戏完整示例【附demo源码下载】
2016/12/12 Javascript
Vue组件选项props实例详解
2017/08/18 Javascript
解决layui中table异步数据请求不支持自定义返回数据格式的问题
2018/08/19 Javascript
小程序云开发之用户注册登录
2019/05/18 Javascript
vue组件命名和props命名代码详解
2019/09/01 Javascript
vue点击按钮动态创建与删除组件功能
2019/12/29 Javascript
JavaScript ECMA-262-3 深入解析(一):执行上下文实例分析
2020/04/25 Javascript
多种类型jQuery网页验证码插件代码实例
2021/01/09 jQuery
Python 实现网页自动截图的示例讲解
2018/05/17 Python
python如何获取apk的packagename和activity
2020/01/10 Python
Pytorch通过保存为ONNX模型转TensorRT5的实现
2020/05/25 Python
python右对齐的实例方法
2020/07/05 Python
CSS教程:CSS3圆角属性
2009/04/02 HTML / CSS
阳光体育:Sunny Sports(购买露营和远足设备)
2018/08/07 全球购物
信息技术专业个人自我评价
2013/12/11 职场文书
化学教师教学反思
2014/01/17 职场文书
另类冲刺标语
2014/06/24 职场文书
党员群众路线个人整改措施思想汇报
2014/10/12 职场文书
幼师辞职信范文大全
2015/05/12 职场文书
高一地理教学工作总结
2015/08/12 职场文书
浅谈如何写好演讲稿?
2019/06/12 职场文书