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实现的鼠标经过时播放声音
May 18 Javascript
javascript题目,重写函数让其无限相加
Feb 15 Javascript
JavaScript Scoping and Hoisting 翻译
Jul 03 Javascript
javascript改变position值实现菜单滚动至顶部后固定
Jan 18 Javascript
使用JQuery快速实现Tab的AJAX动态载入(实例讲解)
Dec 11 Javascript
JQuery组件基于Bootstrap的DropDownList(完整版)
Jul 05 Javascript
什么是Vue.js框架 为什么选择它?
Oct 17 Javascript
Angular-UI Bootstrap组件实现警报功能
Jul 16 Javascript
vue2.0 使用element-ui里的upload组件实现图片预览效果方法
Sep 04 Javascript
JS遍历JSON数组及获取JSON数组长度操作示例【测试可用】
Dec 12 Javascript
fastadmin中调用js的方法
May 14 Javascript
vuex中遇到的坑,vuex数据改变,组件中页面不渲染操作
Nov 16 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
兼容firefox,chrome的网页灰度效果
2011/08/08 PHP
PHP中的插件机制原理和实例
2014/07/08 PHP
php实现RSA加密类实例
2015/03/26 PHP
WordPress中重置文章循环的rewind_posts()函数讲解
2016/01/11 PHP
Zend Framework教程之响应对象的封装Zend_Controller_Response实例详解
2016/03/07 PHP
javaScript中slice函数用法实例分析
2015/06/08 Javascript
jQuery事件处理的特征(事件命名机制)
2016/08/23 Javascript
angular基于路由控制ui-router实现系统权限控制
2016/09/27 Javascript
AngularJS操作键值对象类似java的hashmap(填坑小结)
2016/11/12 Javascript
Bootstrap table 定制提示语的加载过程
2017/02/20 Javascript
babel的使用及安装配置教程
2018/02/22 Javascript
vue.js轮播图组件使用方法详解
2018/07/03 Javascript
angularJs中ng-model-options设置数据同步的方法
2018/09/30 Javascript
详解如何在vscode里面调试js和node.js的方法步骤
2018/12/24 Javascript
vue中node_modules中第三方模块的修改使用详解
2019/05/31 Javascript
微信小程序中悬浮窗功能的实现代码
2019/08/02 Javascript
微信小程序事件流原理解析
2019/11/27 Javascript
js实现贪吃蛇小游戏(加墙)
2020/07/31 Javascript
使用Django的模版来配合字符串翻译工作
2015/07/27 Python
一篇文章弄懂Python中的可迭代对象、迭代器和生成器
2019/08/12 Python
简单了解python中的与或非运算
2019/09/18 Python
python实现超市管理系统(后台管理)
2019/10/25 Python
使用python实现画AR模型时序图
2019/11/20 Python
利用python绘制中国地图(含省界、河流等)
2020/09/21 Python
聊聊python在linux下与windows下导入模块的区别说明
2021/03/03 Python
css3新增颜色表示方式分享
2014/04/15 HTML / CSS
CSS3实现滚动条动画效果代码分享
2016/08/03 HTML / CSS
18-35岁旅游团的全球领导者:Contiki
2017/02/08 全球购物
尤妮佳moony海外旗舰店:日本殿堂级纸尿裤品牌
2018/02/23 全球购物
Stührling手表官方网站:男女高品质时尚手表的领先零售商
2021/01/07 全球购物
环保建议书200字
2014/05/14 职场文书
三月学雷锋活动总结
2014/06/26 职场文书
还款承诺书范本
2015/01/20 职场文书
教代会闭幕词
2015/01/28 职场文书
传单、海报早OUT了,另类传单营销方案送给你!
2019/07/15 职场文书
一起来看看Vue的核心原理剖析
2022/03/24 Vue.js