zoukankan      html  css  js  c++  java
  • JavaScript自动点击链接 防止绕过浏览器访问

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

    基本都是用这个:

       1: <body onLoad="autoclick('auto')">
       2: <a id='auto' href=".$url."><img border='0' src='images/alipaylog.gif' /></a>
       3: </body>
       4: <script type="text/javascript">
       1:  
       2: function autoclick(){
       3:     lnk = document.getElementById("auto");
       4:     lnk.click();
       5: }
    </script>

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

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

       1: <body onLoad="autoclick('auto')">
       2: <a id='auto' href=".$url."><img border='0' src='images/alipaylog.gif' /></a>
       3: </body>
       4: <script type="text/javascript">
       1:  
       2: function autoclick(name)
       3: {   
       4:     if(document.all)   
       5:     {   
       6:         //alert(1);
       7:           document.getElementById(name).click();   
       8:     }   
       9:       else   
      10:     {   
      11:         var evt = document.createEvent("MouseEvents");   
      12:            evt.initEvent("click", true, true);   
      13:         //alert(2);
      14:         document.getElementById(name).dispatchEvent(evt);   
      15:       }   
      16: } 
    </script>

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

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

       1: document.getElementById("me").onclick = function() {
       2:     var card = document.getElementById("card");
       3:     if(document.createEvent){
       4:         var ev = document.createEvent('HTMLEvents');
       5:         ev.initEvent('click', false, true);
       6:         card.dispatchEvent(ev);
       7:     }
       8:     else 
       9:         card.click();
      10: }

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

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

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

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

       1: card = document.getElementById('id');
       2:  
       3: var ev = document.createEvent('HTMLEvents');
       4: ev.initEvent('click', false, true);
       5:  
       6: card.dispatchEvent(ev);

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

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

       1: <body onLoad="autoclick('auto2')">
       2: <input id="auto2" type="hidden"  onClick="javascript:location.href = '&lt;?=$url?>' " />
       3: </body>
       4: <script type="text/javascript">
       1:  
       2: function autoclick(name)
       3: {   
       4:     if(document.all)   
       5:     {   
       6:         //alert(1);
       7:           document.getElementById(name).click();   
       8:     }   
       9:       else   
      10:     {   
      11:         var evt = document.createEvent("MouseEvents");   
      12:            evt.initEvent("click", true, true);   
      13:         //alert(2);
      14:         document.getElementById(name).dispatchEvent(evt);   
      15:       }   
      16: } 
    </script>
  • 相关阅读:
    ibatis mysql replace into 返回ID
    You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '
    Unrecognized VM 'MaxMetaspaceSize
    django缓存机制
    rest_framework认证组件
    路由控制,版本控制,解析器,响应器
    rest_framework频率组件
    rest_framework序列化组件
    django框架 restful规范 CBV源码分析
    Vue项目搭建
  • 原文地址:https://www.cnblogs.com/xmphoenix/p/2038862.html
Copyright © 2011-2022 走看看