• 使用window.open打开新窗口被浏览器拦截的解决方案


    问题描述:

    代码中直接使用window.open('//www.baidu.com', '_blank');会被浏览器窗口拦截

    原因
    浏览器为了维护用户安全和体验,在JS中直接使用window.open(url,"_blank")来打开新的链接是会被拦截的。
    通常项目需要在ajax异步请求完成后来打开新链接,下面提供几种解决方案

    解决方案

    1.最常用的在ajax异步请求成功后打开新窗口

    
     //先在ajax函数之前打开新窗口后再加载url
        $('#btn').click(function () {
            // 打开页面,此处最好使用提示页面
            var newWin = window.open();
            newWin.document.body.innerHTML="正在加载中......";
            $.ajax({
                url: 'www.###.com',
                success: function (url) {
                    // 重定向到目标页面
                    newWin.location.href = url;
                }
            })
        });
    

    2.利用a标签跳转,能解决大多数浏览器兼容问题,但是这种方不适用于ajax异步请求回调中打开新窗口,在ajax异步请求完成后调用无效(用户点击事件触发)

    
      function newWin(url){ //新窗口打开
            var a = document.createElement('a');
            a.setAttribute('href', url);
            a.setAttribute('style', 'display:none');
            a.setAttribute('target', '_blank');
            document.body.appendChild(a);
            a.click();
            a.parentNode.removeChild(a);
        };
         document.body.addEventListener('click', function() {
               newWin('http://www.baidu.com');
            });
        
    

    原文地址:https://segmentfault.com/a/1190000016717630

  • 相关阅读:
    返回一个一维整数数组中最大子数组的和02
    软工作业04四则运算网页版
    所有子数组的和的最大值
    学习进度表(第五,六周)
    学习进度表(第四周)
    四则运算2的单元测试
    《构建之法》阅读笔记02
    软工作业03
    单元测试练习
    学习进度表(第三周)
  • 原文地址:https://www.cnblogs.com/lalalagq/p/9906572.html
Copyright © 2020-2023  润新知