ansaurus

Question

Open Links in Multiple Browser Windows / Tabs

Answer 1

A:

I believe the easiest way is to make use of target="_blank" attribute of anchor tag. Create collection of <a> elements and .click through it.

In theory you could use window.open but this method will open a NEW window and not new TAB as you want.

2009-11-15 14:12:20

Answer 2

+2 A:

I think you are right.

The best way to achieve what you are describing IMHO is to place URL's of links you want to open in new windows into an array, using return false; in order to prevent actually opening link and then to use some sort of loop to open all of them.

I took a liberty of putting together few lines of jQuery code that will do what you have described:

$(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 would look something like:

<!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>

Krule 2009-11-15 14:42:29

In the 'else if' section of the click function you haven't set the data-pack value back to 'true'.

Ambrosia 2009-11-16 01:47:33

You are right, I will correct that. Thank you.

Krule 2009-11-16 01:51:22

++ Nice, I was about to answer in HTML code but you beat me to it.

Secko 2009-11-16 02:07:36

ansaurus

tags:

views:

answers:

Open Links in Multiple Browser Windows / Tabs

related questions