How to open multiple links at once using jQuery script

Question

I have a chart of customers where I need to manually open each customer by "opening in new tab"

I am trying to use a jQuery script so that when I input the script in the console it will open every customer link within that page for me.

Below is the code I have right now. This code works to an extent that it opens only the first customer link out of the 50 in the customer page. Can anyone help me to configure it so it will open every customer in a new tab on the given page?

(I am using the latest version of chrome as my browser)

var $pbfLinks = $('.name a');
     for (var i = 0; i < $pbfLinks.length; i++) {
          var element = $pbfLinks[i];
          var $pbfLink = $(element);
             $pbfLink.attr('target', '_blank');
             $pbfLink[i].click(function() {
                     window.open($pbfLink);
  });
};



 <tbody>
                          <tr data-bind-class="{selected: bulkOperations.selected[6463344]}"
                              data-define="{nestedLinkContainer: new Shopify.NestedLinkContainer(this)}">
                            <td class="select">
                              <div class="next-input-wrapper"><label class="next-label helper--visually-hidden next-label--switch" for="customer_ids_6463344">Select customer, Mayra </label><input type="checkbox" name="customer_ids_6463344" id="customer_ids_6463344" value="6463344" bind="bulkOperations.selected[6463344]" bind-event-change="bulkOperations.selectionChanged()" class="next-checkbox" /><span class="next-checkbox--styled"><svg class="next-icon next-icon--size-10 checkmark"> <use xlink:href="#next-checkmark-thick" /> </svg></span></div>
                            </td>
                            <td class="name no-wrap">
                              <a data-nested-link-target="true" href="/admin/customers/6463344">Mayra </a>
                                                          </td>
                            <td class="location type--subdued">
                                 US
                            </td>
                            <td class="orders tc">0</td>
                            <td class="last_order tc">
                                &mdash;
                            </td>
                            <td class="money_spent tr">$0.00</td>
                          </tr>
                          <tr data-bind-class="{selected: bulkOperations.selected[6463317764]}"

Possible duplicate of How to make a link open multiple pages when clicked — P.S.
– P.S., Commented Jul 29, 2017 at 18:41
This is not related to the post that may be a possible duplicate. The post given is to give each specific link. My issues is that I need multiple random links to be opened by using jQuery. — Andrew Lee
– Andrew Lee, Commented Jul 29, 2017 at 18:43
I have updated the post with the html code @AakashVerma. Thank you — Andrew Lee
– Andrew Lee, Commented Jul 29, 2017 at 19:01
I don't understand why the function is returning false though. — Aakash Verma
– Aakash Verma, Commented Jul 29, 2017 at 19:11

azs06 · Accepted Answer · 2017-07-29 20:53:13Z

Based on information provided on your question, what you are trying to achieve could be done this way.

  var links = $('a[data-nested-link-target="true"]');	
	Array.from(links).forEach(function(link){
		window.open(link.href, '_blank')		
	});

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<a data-nested-link-target="true" href="http://www.google.com">Google </a>
<a data-nested-link-target="true" href="http://www.facebook.com">Facebook </a>
<a data-nested-link-target="true" href="http://www.twitter.com">Twitter </a>	
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
	
</body>
</html>

This is based on the assumption that all customer link have data-nested-link-target="true"attribute; Here is a jsbin of the above code https://jsbin.com/dejotol/edit?html,js,output

Chandra Kumar · Accepted Answer · 2017-07-29 18:52:23Z

0

You can use this code:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script> 
$(document).ready(function() {
    var linksArray =['https://www.google.com','http://www.facebook.com','http://www.stackoverflow.com'];
    var i;
    $('#open').click(function() {
      for( i=0; linksArray.length > i; i++){
        window.open(linksArray[i]);
      }
    });
});
</script>
</head>
<body>

<button id="open" class="button">Open Tabs</button>

</body>
</html>

answered Jul 29, 2017 at 18:52

Chandra Kumar

4,2131 gold badge19 silver badges26 bronze badges

1 Comment

Andrew Lee Over a year ago

Thank you for your help. Just to be sure this code will require me to input each link individually within the array? and if so is there a way where instead of manually inputting the links.. I can just loop and/or iterate through each "class name" where the link is stored? In my example you can see all the links I am trying to retrieve is from ".name a". Every link I need to open in a new tab is contained in the same class name but different <td> levels.

Aakash Verma · Accepted Answer · 2017-07-29 19:28:14Z

0

The HTML code you've posted on request looks incomplete. Hoping the structure to be somewhat like

<div class="name"...>
<tr>
<td>
<a href="...>
</td>

Try this:

$('.name > tr > td').each(function() {
    var $this = $(this > a);
    $this.attr('target', '_blank');
    $this.click(function() {
        window.open($this.attr('href'));
        window.focus();
        return false;
  });
});

answered Jul 29, 2017 at 19:28

Aakash Verma

4,0447 gold badges37 silver badges75 bronze badges

Collectives™ on Stack Overflow

How to open multiple links at once using jQuery script

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related