CODEWITHSUNDEEP
javascriptjquery
Andrew Lee
Andrew Lee

Reputation: 304

How to open multiple links at once using jQuery script

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?

enter image description here

(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]}"

Upvotes: 0

Views: 2851

Answers (3)

azs06
azs06

Reputation: 3517

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

Upvotes: 1

Aakash Verma
Aakash Verma

Reputation: 3994

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;
  });
});

Upvotes: 0

Chandra Kumar
Chandra Kumar

Reputation: 4205

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>

Upvotes: 0

Related Questions