在多个浏览器窗口/选项卡中打开链接答案

【问题标题】：Open Links in Multiple Browser Windows / Tabs在多个浏览器窗口/选项卡中打开链接
【发布时间】：2009-11-15 14:04:29
【问题描述】：

我需要单击多个链接（选择它们），然后单击一个按钮，该按钮将在新窗口或选项卡中打开所有选定的链接。这当然取决于浏览器的行为。

我的计划是使用 Javascript 将选定的链接添加到数组中，然后单击提交按钮后，javascript 将遍历数组并为每个项目打开一个新窗口。我可能会在 jQuery 中做到这一点。

有没有人做过类似的事情？有替代品吗？

【问题讨论】：

标签： javascript jquery tabs window

【解决方案1】：

我认为你是对的。

实现您所描述的恕我直言的最佳方法是将要在新窗口中打开的链接的 URL 放入一个数组中，使用 return false; 以防止实际打开链接，然后使用某种循环来全部打开。

我冒昧地整理了几行 jQuery 代码，这些代码将执行您所描述的操作：

$(document).ready(function() {
    var $hash = new Array(); // We create new Array 
    $('a').click( function(){ // On each click to <a> element
        if ( $(this).attr("data-pack") == "true" ) { // check wether this is one of the links we use
            $hash[$(this).attr("id")] = $(this).attr("href"); // We add href value into $hash object
            $(this).css("color","green"); // Way to mark selected ones
            $(this).attr("data-pack", "selected"); // Change data-pack property value to selected
            return false; // We don't want to execute this yet
        } else if ( $(this).attr("data-pack") == "selected" ) { // In case you change your mind and want to unselect
            $(this).attr("data-pack", "true"); // Change data-pack property back, thanks to Ambrosia pointing it out in the comment
            $(this).css("color","red"); // We mark it as unset
            delete $hash[$(this).attr("id")]; // Remove it from hash
            return false;
        }
    });

    $("form").submit( function(){ // After we submit
        for (var i in $hash) { // Go trough $hash
            window.open($hash[i]); // And open window for each member
        }
        return false; // We don't actually want to submit form, just open new windows :)
    } );    
});

HTML 看起来像：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Page Title</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript" charset="utf-8" async defer></script>
    <script src="application.js" type="text/javascript" charset="utf-8" async defer></script>
</head>
<body>
    <a href="#link1" data-pack="true" id="link1">data</a>
    <a href="#link2" data-pack="true" id="link2">data</a>
    <a href="#link3" data-pack="true" id="link3">data</a>
    <a href="#link4" data-pack="true" id="link4">data</a>
    <a href="#">ordinary link</a>

    <form>          
        <input type="submit" value="submit">
    </form>
</body>
</html>

【讨论】：

在点击函数的“else if”部分中，您没有将数据包值设置回“true”。
++ 很好，我正准备用 HTML 代码回答，但你抢先了。

【解决方案2】：

我相信最简单的方法是利用锚标记的target="_blank" 属性。通过它创建<a> 元素和.click 的集合。

理论上你可以使用window.open，但这种方法会打开一个新窗口，而不是你想要的新标签。

【讨论】：