We Keep Coding

Open 10 tabs on one click

I am new in Javascript. I try to open 10 new tabs with the same link but when I run the code and click on the button it opens only one tab with this url. Please tell me how to do that in js.
Here is the code:
<button
onclick="virus()"
type="button"
name="button"
>Start your Magic!</button>
<script>
function virus() {
for(var i = 0; i < 10; i++) {
window.open("https://www.w3schools.com/js/js_jquery_selectors.asp");
}
}
</script>

This is discussed extensively in this stackoverflow thread: Open multiple links in Chrome at once as new tabs
The long and short of it is that modern browsers don't seem to allow this.

First make sure you allow "Pop-ups and redirects" from chrome like the attached image.
Second try to wrap the code in a timeout like:
for (var i = 0; i < 10; i++) {
setTimeout(() => {
window.open("https://www.w3schools.com/js/js_jquery_selectors.asp" );
}, 200);
}

window.open() accepts a second parameter as windowName. So if there is no browsing context with a particular name, a new browsing context is created.
So since you haven't passed the second argument, all other window.open calls after the first one, will not create a new browsing context and won't open new windows/tabs.
So for a fix, you can try using the below code -
<button onclick="virus()" type="button" name="button"> Start your Magic!</button>
<script>
function virus(){
for(var i=0;i<10;i++){
window.open("https://www.w3schools.com/js/js_jquery_selectors.asp", i.toString());
}
}
I have passed a second argument as well to the window.open() which would help create a new browsing context every time the method is called.

links within an iframe window to open in new tab

I have seen this question many times, and a lot of the answers seem to suggest the base target="_blank" technique. However, I have used this before in the past; but my current page it does not work. I also don't think it could be best option even if it did work; as I ONLY want the links within the iframe src="" to open in a new window. I am hopping there's a simple solution I can add inline to the page. I have also tried adding an id as below, and using JavaScript, still nada.
<iframe src="mywordpressfeed.html" id="frame1" width="310" height="380"></iframe>
JS
$(document).ready(function(){
$("#frame1").attr("target","_blank");
});
Basically the goal is to when a user sees my wordpress feed within the iframe I have on a static page; once the post title is clicked it loads in a new window - as now it loads within the same iframe so there isn't an increased level of readability.

There is no real solution to this, due to the iFrame tag being developed for the opposite.

//pass the iframe to this iframe getting function
function iframeRef( frameRef ) {
return frameRef.contentWindow ? frameRef.contentWindow.document : frameRef.contentDocument
}
//Get Iframe
var inside = iframeRef( document.getElementById('iframeID') );
//Get all links
var links = inside.getElementsByTagName('a');
//Loop throught links and set their attributes
for (var i = 0 ; i<links.length ; i++){
links[i].setAttribute('target','_blank');
}
//No jQuery needed!
thanks to meder
EDIT
Due to iframe same source restrictions I had to find a website with inner iframe from same source so you can paste this code
//pass the iframe to this iframe getting function
function iframeRef( frameRef ) {
return frameRef.contentWindow ? frameRef.contentWindow.document : frameRef.contentDocument
}
//Get Iframe
var inside = iframeRef( document.getElementById('IFwinEdit_Gadget_247730_3349') );
//Get all links
var links = inside.getElementsByTagName('input');
//Loop throught links and set their attributes
for (var i = 0 ; i<links.length ; i++){
links[i].setAttribute('style','background:red');
}
//No jQuery needed!
to the console in this web site and see the inputs change color

How to make a link open multiple pages when clicked

I have two (or more) links. For example: http://google.com and http://yahoo.com.
How can I make them both open when I click on a single link?
For example, a link entitled "click here" which, when clicked, will open two different blank windows.

HTML:
Click Here
JS:
$('a.yourlink').click(function(e) {
e.preventDefault();
window.open('http://yoururl1.com');
window.open('http://yoururl2.com');
});
window.open also can take additional parameters. See them here: http://www.javascript-coder.com/window-popup/javascript-window-open.phtml
You should also know that window.open is sometimes blocked by popup blockers and/or ad-filters.
Addition from Paul below: This approach also places a dependency on JavaScript being enabled. Not typically a good idea, but sometimes necessary.

I did it in a simple way:
<a href="http://virtual-doctor.net" onclick="window.open('http://runningrss.com');
return true;">multiopen</a>
It'll open runningrss in a new window and virtual-doctor in same window.

You might want to arrange your HTML so that the user can still open all of the links even if JavaScript isn’t enabled. (We call this progressive enhancement.) If so, something like this might work well:
HTML
<ul class="yourlinks">
<li><a href="http://www.google.com/"></li>
<li><a href="http://www.yahoo.com/"></li>
</ul>
jQuery
$(function() { // On DOM content ready...
var urls = [];
$('.yourlinks a').each(function() {
urls.push(this.href); // Store the URLs from the links...
});
var multilink = $('Click here'); // Create a new link...
multilink.click(function() {
for (var i in urls) {
window.open(urls[i]); // ...that opens each stored link in its own window when clicked...
}
});
$('.yourlinks').replaceWith(multilink); // ...and replace the original HTML links with the new link.
});
This code assumes you’ll only want to use one “multilink” like this per page. (I’ve also not tested it, so it’s probably riddled with errors.)

You can open multiple windows on single click... Try this..
<a href="http://--"
onclick=" window.open('http://--','','width=700,height=700');
window.open('http://--','','width=700,height=500'); ..// add more"
>Click Here</a>`

You need to unblock the pop up windows for your browser and the code could work.
chrome://settings/contentExceptions#popups

I created a bit of a hybrid approach between Paul & Adam's approach:
The link that opens the array of links is already in the html. The jquery just creates the array of links and opens each one when the "open-all" button is clicked:
HTML:
<ul class="links">
<li></li>
<li></li>
</ul>
<a id="open-all" href="#">OPEN ALL</a>
JQUERY:
$(function() { // On DOM content ready...
var hrefs = [];
$('.links a').each(function() {
hrefs.push(this.href); // Store the URLs from the links...
});
$('#open-all').click(function() {
for (var i in hrefs) {
window.open(hrefs[i]); // ...that opens each stored link in its own window when clicked...
}
});
});
You can check it out here:
https://jsfiddle.net/daveaseeman/vonob51n/1/

Here is a basic implementation in javascript - I separated it into an external file
HTML
Click To Open Links
JS
var myLinks = [
"https://google.com",
"https://www.w3schools.com/jsref/met_win_open.asp",
"https://developer.mozilla.org/en-US/docs/Web/API/Window/open"
]
function openMultipleLinks(links) {
for (var i = 0; i < links.length; i ++) {
window.open(links[i]);
}
}
Note that the user will have to enable pop-ups for the pages to open.
Here it is in action: https://jsfiddle.net/cuppajoeman/rjavuhcg/

If you prefer to inform the visitor which links will be opened, you can use a JS function reading links from an html element. You can even let the visitor write/modify the links as seen below:
<script type="text/javascript">
function open_all_links() {
var x = document.getElementById('my_urls').value.split('\n');
for (var i = 0; i < x.length; i++)
if (x[i].indexOf('.') > 0)
if (x[i].indexOf('://') < 0)
window.open('http://' + x[i]);
else
window.open(x[i]);
}
</script>
<form method="post" name="input" action="">
<textarea id="my_urls" rows="4" placeholder="enter links in each row..."></textarea>
<input value="open all now" type="button" onclick="open_all_links();">
</form>

Use HTML/CSS/Javascript to open links in new pages

I have a div that is represented in multiple pages across my site. I don't want to set each one specifically to open in a new window, rather I want all links in that specific div to open in a new window. How can I do this using HTML/ CSS/ javascript?
Thanks

here's how you could do that with jQuery
if you have something like <div class="myLinks">...</div>
$('.myLinks a').attr("target", "_blank");

Well, I guess there are two reasonable ways to open the href from an anchor in a new window.
Edit the node and set its target to _blank ()
Use Javascript to catch the click event, prevent the default behavior and call window.open()
var anchors = document.querySelectorAll('#mydiv a');
[].forEach.call(anchors, function(anchor) {
anchor.addEventListener('click', function(e) {
window.open(e.target.href, 'mywindow', '_blank');
e.preventDefault();
e.stopPropagation();
}, false);
});
That example code is vanilla Javascript and it'll only work in a W3C compliant browser (!= IE).
If you can afford to you use a JS framework live is going to be easier since all of those will abstract browser differences for you.

I think you have a div and link like this in some pages:
<div id="myDiv">
Link Text
<!--some other elements-->
</div>
you need to create a js file like bellow and add it to end of all of your pages :
var div = document.getElementById("myDiv");
if (div) {
for (var i = 0; i < div.childNodes.length; i++)
{
if (div.childNodes[i].nodeName.toLowerCase() == "a")
div.childNodes[i].target = "_blank";
}
}
And its all things you need to do !
this code is fast enough and even does not need JQuery.

Couldn't you use jQuery to iterate through all links within a specified div, then set the target to "_blank".

You can use javascript and jQuery.
First of all I suggest that DIV have id outgoing.
<div id='outgoing'>
<a href='http://google.com'>Go to Google</a><br>
<a href='http://stackoverflow.com'>Look at SO!</a>
</div>
Now we can use simple JavaScript to dynamiclaly add target='blank' into these links:
$(function() {
$('#outgoing a').attr('target', '_blank');
});
You can check example here

Disabling a link tag using JavaScript on my printable page

I have a script that creates a printable page by copying the HTML across and then doing some manipulation, such as disabling the buttons on the page, on page load.
I also want to disable the links on the page. I don't really mind if they look like links still as long as they don't do anything, and don't give any JavaScript errors!
The anchor tag doesn't seem to have a disabled attribute...
Unfortunately, I can't use jQuery, so JavaScript only please!
Edit: I want to disable the links, buttons etc on the page so that when the 'printable page' opens in another window, the user cannot mess with it by clicking buttons or links. I want it to essentially be a 'frozen snapshot' of the page that they want to print.

Setting their href to # and overwriting the onclick event should do the trick.
var links = document.getElementsByTagName("A"), j;
for (j = 0;j < links.length; j += 1) {
links[j].href = '#';
links[j].onclick = function () {
return false;
};
}

Why can't you use jQuery? So much nicer...
$('a').each(function(){this.onclick=function(){return false}});
Anyway here is a normal javascript way. Smaller than above and you also don't need to modify the links... by defining the onclick function to return false it will not visit the href:
var anchors = document.getElementsByTagName("a");
for (i = 0; i < anchors.length; i++)
anchors[i].onclick = function(){return false};

There is also an array of links in the document object. While I've never tried, I believe you can set them too.
for (i=0;i<document.links.length;i+=1) {
document.links[i]=='#';
}