zoukankan      html  css  js  c++  java
  • JavaScript打开新窗口被拦截问题

    新窗口打开页面,一个很常用的效果,至于代码,一般第一反应都是这么写:
    window.open(url);
    但是主流的浏览器都会拦截这种效果(可能这些年弹窗广告太多,如果浏览器不拦截,用户受不了)
     
    为了避免弹窗被拦截,一般都是利用a标签来打开一个新的页面,利用a标签的target="_blank"属性,一般根据情况使用下面这两种方法:
    1、由点击事件触发新窗口打开:
    ----当然可以直接在页面使用a标签,这里只是为下文做铺垫的啦!
    <a href="http://www.baidu.com/" target="_blank"></a>
    可以将触发点击的按钮改成:
    <a href="javascript:void(0)"  target="_blank" id="openWindow"></a>  
    点击事件写成 :
    1 $("#openWindow").click(function(e){  
    2     $(this).attr("href","http://www.baidu.com/");  
    3 });  
    按照事件触发的顺序,点击的时候修改a标签的href,然后不中断默认事件,会接着触发a标签的默认事件,打开一个新的页面。
    注意:如果需要打开新窗口,click事件中不能使用return false,e.preventDefault();等中断默认事件的语句。
     
    2、其他情况:如果没有一个a标签用来打开页面,那么我们就创造一个新的a标签出来,再模拟这个a标签的点击事件
    jQuery写法:
    1 function openWindow(url){  
    2      var link = $("<a></a>").attr("href",url).attr("target","_blank");  
    3      $("body").append(link);  
    4      link[0].click();  
    5      link.remove();  
    6  }
    原生JavaScript写法:
    1 function openWindow(url){  
    2     var link = document.createElement('a');  
    3     link.target = "_blank";  
    4     link.href = url;  
    5     document.body.appendChild(link);  
    6     link.click();  
    7     document.body.removechild(link);  
    8 }  
     
  • 相关阅读:
    三国演义中的十大谎言 VS 程序员十大口头禅
    Node.js 的单线程事件驱动模型和内置的线程池模型
    为了让医院把医护还给患者,他们用了这个…
    华为云数据库内核专家为您揭秘:GaussDB(for MySQL)并行查询有多快?
    brew
    Python
    Python
    Python
    AtCoder Beginner Contest 215 (个人题解 A~F)
    AcWing 第 13 场周赛  补题记录
  • 原文地址:https://www.cnblogs.com/sunyuweb/p/9012909.html
Copyright © 2011-2022 走看看