无法使用javascript / jquery打开新标签页或窗口

Question

请注意，这不适用于实时网站;这只是我自己丰富的一些实验。我在Mac OSX 10.9.3上运行Chrome版本35.0.1916.153（最新版）。

正如许多其他人试图做的那样，我正在尝试让javascript在新标签页中打开链接。那里有很多例子，但我不能让它们中的任何一个起作用。最有希望的想法似乎是模拟锚点上的cmd +点击。发生click事件，并且事件对象的metaKey属性设置为true，正如我在添加单击处理程序时所看到的，但没有打开URL：没有新窗口，没有新选项卡。< / p>

HTML：

<a id="still" href="gv__.html?pictureMode=still" target="_blank">still</a>
<a id="motion" href="gv__.html?pictureMode=motion" target="_blank">motion</a>

JS：

$(document).ready(function() {
    var e = $.Event( "click", { metaKey: true } );

    $("a#motion").trigger(e);
    $("a#still").trigger(e);
    $("a#motion").trigger(e);
    $("a#still").trigger(e);
});

我做错了什么？

Answer 1

问题是，当您尝试以编程方式打开新窗口/选项卡时，浏览器通常会阻止您的代码。

因此，用户操作始终必须触发新的标签/窗口开口。 （否则我们总是满满的弹出式广告）

首先，确保您的js是在用户事件上执行的，然后您应该可以使用window.open。

JsFiddle example

HTML：

<a href="//google.com" target="blank">new tab google</a>

<button class="user">user triggered</button>
<button class="programatic">programatic</button>

JS：

$('a').on('click', function(e) {
    console.log('clicked', e);
    // unfortunately although we simulated 
    // the click on the <a/> , it will still 
    // not launch a new window - idk why.
    // therefore we can use the line below
    // to open the <a>'s href in a new tab/window
    // NOTE: this will only occur if the execution was
    // triggered by the user
    window.open(e.currentTarget.href);
});

var simulateClick = function(origEv) {
    var e = $.Event("click");
    e.ctrlKey = true;
    e.metaKey = true;
    e.originalEvent = origEv;
    $('a').trigger(e);
};

$('button.user').on('click', function(e) {
    // this call will actually open a window
    simulateClick(e);
});

$('button.programatic').on('click', function(e) {
    // this will result in a blocked popup
    $.get('/someurl').always(function() {
        // executes the method after a non-user event
        // results in blocked popup
        simulateClick(e);
    });
});

// this will result in a blocked popup
setTimeout(simulateClick, 1000);

Answer 2

试试这个：

var e = $.Event("click");
e.ctrlKey = true;
$("a#motion").trigger(e);
$("a#still").trigger(e);
$("a#motion").trigger(e);
$("a#still").trigger(e);