动态按钮上jquery中所有浏览器上的弹出块

Question

我想在新标签页中打开一个 url。 Url 来自成功 url 返回的 ajax 请求，并希望在新选项卡中打开。 目前 chrome 会popup blocked一个消息popup blocked 。 这是我的 HTML 代码：

<input type="button" id="btnTest" onclick="GetLink()" value="Test" />

单击此按钮并调用 ajax 请求。 下面的返回 url 是我的 js 代码

function GetLink() {       
        $.post('@Url.Action("GetUrl", "TestController")', {
            Id: $('#Id').val(),
            Id1: $('#Id1').val(),
            Id2: $('#Id2').val()
        }).done(function (data) {

            var a = document.createElement("a");
            a.addEventListener("click", function (e) {
                a.href = data;
                a.target = '_blank';
                return false;
            });

            a.click();          
        });
    }

弹出窗口被阻止的图像

我创建一个按钮，然后单击此按钮。 它给我消息弹出窗口被阻止。 请帮我摆脱这个问题..

Answer 1

我认为浏览器会阻止打开新选项卡，因为用户单击和实际弹出代码之间存在延迟。

我的建议是：

function GetLink() {       
    var url = '@Url.Action("GetUrl", "TestController")' + "?Id=" + $('#Id').val() + "&Id1=" + $('#Id1').val() + "&Id2=" + $('#Id2').val();
    var win = window.open(url, '_blank');
    win.focus();
}

<input type="button" id="btnTest" onclick="GetLink()" value="Test" />

在您的TestController -> GetUrl ，获取 URL 参数（ Id 、 Id1和Id2 ）。 处理数据并重定向到新 URL。

无需通过 ajax 返回新 URL 并打开新选项卡。