使用window.open打開新窗口被瀏覽器攔截的解決方案

jemygraw 發(fā)布于2019-08-02 11:45 / 1255人閱讀

摘要：?jiǎn)栴}描述代碼中直接使用會(huì)被瀏覽器窗口攔截原因?yàn)g覽器為了維護(hù)用戶安全和體驗(yàn)，在中直接使用，來打開新的鏈接是會(huì)被攔截的。

問題描述：

代碼中直接使用window.open("http://www.baidu.com", "_blank");會(huì)被瀏覽器窗口攔截

原因
瀏覽器為了維護(hù)用戶安全和體驗(yàn)，在JS中直接使用window.open(url，"_blank")來打開新的鏈接是會(huì)被攔截的。
通常項(xiàng)目需要在ajax異步請(qǐng)求完成后來打開新鏈接，下面提供幾種解決方案

解決方案

1.最常用的（在ajax異步請(qǐng)求成功后打開新窗口）

 //先在ajax函數(shù)之前打開新窗口后再加載url
    $("#btn").click(function () {
        // 打開頁(yè)面，此處最好使用提示頁(yè)面
        var newWin = window.open();
        newWin.document.body.innerHTML="正在加載中......";
        $.ajax({
            url: "www.###.com",
            success: function (url) {
                // 重定向到目標(biāo)頁(yè)面
                newWin.location.href = url;
            }
        })
    });

2.利用a標(biāo)簽跳轉(zhuǎn)，能解決大多數(shù)瀏覽器兼容問題，但是這種方不適用于ajax異步請(qǐng)求回調(diào)中打開新窗口,在ajax異步請(qǐng)求完成后調(diào)用無(wú)效(用戶點(diǎn)擊事件觸發(fā))

  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");
        });

云服務(wù)器 GPU云服務(wù)器彈出窗口被攔截新窗口打開打開新窗口 ajax打開新窗口

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/53101.html

相關(guān)文章

window.open 打開新窗口被攔截的解決方案

摘要：使用包裝一下，也可以防止被瀏覽器攔截。注意這里的超時(shí)時(shí)間不能太短，否則也會(huì)被攔截。我們會(huì)遇到想要彈出一個(gè)窗口，可是卻是在事件執(zhí)行后，才去彈出來的，這時(shí)就會(huì)被瀏覽器攔截，我們可以通過下面的方法來避免先用打開一個(gè)窗口，然后修改地址。最近公司開發(fā)的一個(gè)項(xiàng)目，平凡用到下載各種類型的文件，但是例如.txt,.jpg,.pdf格式的文件呢瀏覽器會(huì)在當(dāng)前窗口直接打開，影響用戶體驗(yàn)，嘗試各種方案和百...

JeOam 2019-08-22 18:16 評(píng)論0 收藏0
window.open 打開新窗口被攔截的解決方案

摘要：使用包裝一下，也可以防止被瀏覽器攔截。注意這里的超時(shí)時(shí)間不能太短，否則也會(huì)被攔截。我們會(huì)遇到想要彈出一個(gè)窗口，可是卻是在事件執(zhí)行后，才去彈出來的，這時(shí)就會(huì)被瀏覽器攔截，我們可以通過下面的方法來避免先用打開一個(gè)窗口，然后修改地址。最近公司開發(fā)的一個(gè)項(xiàng)目，平凡用到下載各種類型的文件，但是例如.txt,.jpg,.pdf格式的文件呢瀏覽器會(huì)在當(dāng)前窗口直接打開，影響用戶體驗(yàn)，嘗試各種方案和百...

Ajian 2019-08-02 10:45 評(píng)論0 收藏0
window.open 打開新窗口被攔截的解決方案

摘要：使用包裝一下，也可以防止被瀏覽器攔截。注意這里的超時(shí)時(shí)間不能太短，否則也會(huì)被攔截。我們會(huì)遇到想要彈出一個(gè)窗口，可是卻是在事件執(zhí)行后，才去彈出來的，這時(shí)就會(huì)被瀏覽器攔截，我們可以通過下面的方法來避免先用打開一個(gè)窗口，然后修改地址。最近公司開發(fā)的一個(gè)項(xiàng)目，平凡用到下載各種類型的文件，但是例如.txt,.jpg,.pdf格式的文件呢瀏覽器會(huì)在當(dāng)前窗口直接打開，影響用戶體驗(yàn)，嘗試各種方案和百...

Object 2019-08-30 15:53 評(píng)論0 收藏0
js 打開新窗口方式

摘要：之前的項(xiàng)目，有個(gè)功能是下載文件，這里只要在瀏覽器輸入就會(huì)下載那個(gè)文件了。之前的項(xiàng)目，有個(gè)功能是下載文件，這里只要在瀏覽器輸入 url 就會(huì)下載那個(gè)文件了。當(dāng)時(shí)我只是簡(jiǎn)單得使用 window.open ，但是卻會(huì)被瀏覽器進(jìn)行攔截，要手動(dòng)開啟才行，然后就搜索研究其他方法，就看到各種各樣的，通過 js 打開新窗口的方法了，這里就總結(jié)一下解決下載功能這里就先說解決下載功能的方法，通過同事...

mgckid 2019-08-21 17:21 評(píng)論0 收藏0
js 打開新窗口方式

摘要：之前的項(xiàng)目，有個(gè)功能是下載文件，這里只要在瀏覽器輸入就會(huì)下載那個(gè)文件了。之前的項(xiàng)目，有個(gè)功能是下載文件，這里只要在瀏覽器輸入 url 就會(huì)下載那個(gè)文件了。當(dāng)時(shí)我只是簡(jiǎn)單得使用 window.open ，但是卻會(huì)被瀏覽器進(jìn)行攔截，要手動(dòng)開啟才行，然后就搜索研究其他方法，就看到各種各樣的，通過 js 打開新窗口的方法了，這里就總結(jié)一下解決下載功能這里就先說解決下載功能的方法，通過同事...

Jensen 2019-08-01 17:54 評(píng)論0 收藏0