Opening each link in a each new window

Opening each link in a each new window - javascript

I would like to know how to open each link in a each new window (not Tabs).
I have around 4 links and I used the below sort of code.
<a href="Images\Chapter1.pdf"
onclick="window.open(this.href, 'new window','width=1000,height=600'); return false;">
I have 4 links and the above code works to some extent.
When I press any of these 4 links then a new window is going to open the pdf document but when I click on the 2nd link then the opened window is changing it's content to 2nd pdf but I would like to have two new short windows with the content but not only one new window changing it's Content.
(Target="_Blank" will open the content in a new tab but not in a new window).
Let me know how to overcome this issue.

Try this (note will not work inside SO's editor) - the code will give a new name to each window:
var wins = [];
window.onload = function() {
var links = document.querySelectorAll(".pdfLink");
for (var i = 0; i < links.length; i++) {
links[i].onclick = function() {
var idx = wins.length;
wins[idx] = window.open(this.href, 'newwindow' + idx, 'width=1000,height=600');
return false;
}
}
}
PDF1
PDF2
PDF3
PDF4
If you want to allow the page to open even if there is a popup blocker, try this:
var wins = [];
window.onload = function() {
var links = document.querySelectorAll(".pdfLink");
for (var i = 0; i < links.length; i++) {
links[i].onclick = function() {
var idx = wins.length;
wins[idx] = window.open(this.href, 'newwindow' + idx, 'width=1000,height=600');
return wins[idx]?false:true;
}
}
}
PDF1
PDF2
PDF3
PDF4
Also note that you can write
links[i].onclick = function(e) {
e.preventDefault();
and remove the return false - since we use querySelectorAll, the preventDefault is supported in the same browsers

You are opening a new window with the name 'new window'. On the second click, you specify the same window.
If you use a new name in each call, they should open in separate windows.

Related

How to open all offsite links in a new window except for specific href?

On my site, I have some links that are built dynamically with JS. Not all of them contain an href value, so I add an href value dynamically. I use javascript:; as that value.
Now, I need to be able to open all links not on my host in a new window. Obviously, javascript:; is not my host, so any link with that in the href attribute will open in a new window.
In the snippet below, I'm trying to prevent that from happening, but I'm not getting the result I desire.
How do I push all offsite links to a new tab, except for one that I specify?
document.querySelectorAll("a:not(a[href])").forEach(element => {
element.setAttribute("href", "javascript:;")
});
var all_links = document.querySelectorAll('a');
for (var i = 0; i < all_links.length; i++) {
var a = all_links[i];
if (a.hostname != location.hostname || a.getAttribute("href") !== 'javascript:;') {
a.rel = 'noopener';
a.target = '_blank';
}
}
Yahoo!
<hr>
<a>something else</a>

Looks like this was the best solution...
If you inspect each link, you'll see that the external link has _blank, the internal link has _self, and the one with href="javascript:;" has _self.
document.querySelectorAll("a:not(a[href])").forEach(element => {
element.setAttribute("href", "javascript:;")
});
let all_links = document.querySelectorAll('a');
for (var i = 0; i < all_links.length; i++) {
let anchors = all_links[i];
if (anchors.getAttribute('href') == 'javascript:;' || anchors.hostname == location.hostname) {
anchors.target = "_self";
} else {
anchors.target = "_blank";
}
}
External Link (Yahoo!)
<hr>
Change the font and the line spacing of a style (SO Question)
<hr>
<a>anchor without href (Goes nowhere)</a>

Chrome Extension Top Visited List

I'm trying to make an extension that looks at your most visited sites and then tells you things about yourself given those sites.
I'm a bit lost with how to go about this and was wondering, do I run the script with the background.js file? or when they click the popup?
This is the code I'm looking to replicate,
// Event listener for clicks on links in a browser action popup.
// Open the link in a new tab of the current window.
function onAnchorClick(event) {
chrome.tabs.create({ url: event.srcElement.href });
return false;
}
// Given an array of URLs, build a DOM list of these URLs in the
// browser action popup.
function buildPopupDom(mostVisitedURLs) {
var popupDiv = document.getElementById('mostVisited_div');
var ol = popupDiv.appendChild(document.createElement('ol'));
for (var i = 0; i < mostVisitedURLs.length; i++) {
var li = ol.appendChild(document.createElement('li'));
var a = li.appendChild(document.createElement('a'));
a.href = mostVisitedURLs[i].url;
a.appendChild(document.createTextNode(mostVisitedURLs[i].title));
a.addEventListener('click', onAnchorClick);
}
}
chrome.topSites.get(buildPopupDom);
This is sort of not working at the moment.

How to find links on a page, push them to array and open by each click 5 links from array?

I am looking for a way how to open few links in new tabs by one click.
Here is some HTML-code I wrote.
<ul>
<li>Google</li>
<li>Bing</li>
<li>Ebay</li>
<li>Amazon</li>
</ul>
<hr>
Open all links above by one click!
UPD: If it is possible, it would be great if it will search all links on a page wrapped with <li></li>, push them to array, and after a click link should open next 4 links from array.
jsFiddle example

Without questioning your motives (because you will be blocked by the popup blocker),
function open4links () {
var links = ['http://...', 'http://...', 'http://...', 'http://...'];
for (var i = 0; i < links.length; i++) {
window.open(links[i], '_blank');
}
}
(the a element).onclick = open4links;

Here, this works for me (based on the updated request): http://jsfiddle.net/R7qFv/4/
This keeps track of which links have been opened, so each time you click the link, it will open the next 4 in the list.
$("#openlinks").on("click", (function(){
var count = 0, nAtOnce = 4, $links = $("li a");
var openLinks = function(){
for (var i = 0; i < nAtOnce && count < $links.length; i++) {
window.open($links.eq(count++).attr("href"), '_blank');
}
};
return openLinks;
})());
I wrote it using jQuery because it's easier for me, but I'm sure you can translate if needed.

using window.open:
$('a').click(function(e) {
e.preventDefault();
$('li a').each(function(){
window.open($(this).attr("href"), '_blank');
});
});
As you can see in the JsFiddle, most browsers won't accept this because it is considered spam.

Use this to find all links in your html code and open in other window
<script type="text/javascript">
function OpenLinks(){
var arr = [];
$("#list a").each(function(){
arr.push(jQuery(this).attr("href"));
});
for(var i =0; i < arr.length;i++){
window.open(arr[i]);
}
}
</script>
obs: use jquery!

Open multiple javascript popup boxes with one button click

This is a JavaScript question.
I need to create a button which, when clicked once, will open up 5 sub-windows (popup boxes).
One box will be in the top left corner of the screen, one in the top right corner, one in the lower left corner, one in the lower right corner, and one in the center. Each box will have a different URL.
When the main window is closed, all of the sub-windows should also close.
I have only been able to do the code that opens one popup - cannot figure out how to code all 5 to open at once with one button click and then close them all when the parent window closes.
Here is what I have so far:
<SCRIPT language="JavaScript">
function myPopup(URL) {
popupWindow = window.open(URL,'popUpWindow','height=500,width=500,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
}
</SCRIPT>
Open Pop-Up
Many thanks to anyone who can help me out.
Thanks to everyone who is helping me. By utilizing the feedback here, I have worked on this project all day and have come up with some code that works. I was not sure how to assign urls for each popup to the array - but at least they work.
However, I can not get all the popups to close when the parent window closes. Hope you can help. Here is the new code:
<script type="text/javascript">
/*Use Array - Open 5 new popup windows using onclick*/
function newWindow() {
var winPop = new Array();
winPop[winPop.length] = window.open('top_right.html','window1','scrollbars=no,width=235,height=155,left=1000,top=200,screenX=1000,screenY=200');
window.open('top_left.html','window2','scrollbars=no,width=235,height=155,left=325,top=200,screenX=325,screenY=200');
window.open('bottom_left.html','window3','scrollbars=no,width=235,height=155,left=325,top=600,screenX=325,screenY=600');
window.open('bottom_right.html','window4','scrollbars=no,width=235,height=155,left=1000,top=600,screenX=1000,screenY=600');
window.open('center_page.html','window5','scrollbars=no,width=235,height=155,left=660,top=450,screenX=660,screenY=450');
}
/*NOT WORKING FOR ME --Close all popups when parent window is closed*/
onbeforeunload = function() {
for (var index = 0; index < winPop.length; ++index)
winPop[index].close();
}
</script>
</head>
<body>
<div id="wrap"> <a href='' onclick='newWindow()'><img src='images/group_clicker.gif' border='0'></a> </div>
</body>

DEMO
Save all opened windows to an array.
Register for the beforeUnload event, and when it fires, loop through the popups close()'ing them.
NB: I think it's jsFiddle or Chrome, but it won't open more than 1 popup per click.
And due to restrictions placed on popup opening you cannot reliably control the position of opened popups. It may be useful for you to open in-window popups like YUI's panel or jQuery(UI)'s dialogue
function openPopup(howMany) {
var popups = [];
var temp;
for (var index = 0; index < howMany; ++index) {
popups.push(open('', '', 'height=500,width=500'));
popups[index].document.write('popup ' + (index + 1) + ' of ' + howMany + '<br/>this will close on parent window close');
}
closeFunc = function() {
for (var index = 0; index < popups.length; ++index)
popups[index].close();
};
if (addEventListener)
addEventListener('beforeunload', closeFunc, false);
else
attachEvent('onbeforeunload', closeFunc);
}

You could use a for loop to open multiple windows. Be sure to give a unique name to popup window
function myPopup(URL) {
for (var i = 0; i < 5; i++) {
var popupWindow = window.open(URL, i, 'height=500,width=500,left=100,top=100,resizable=yes,scrollbars=yes,toolbar=yes,menubar=no,location=no,directories=no, status=yes');
}
}

An answer to your edit:
You wrote
function newWindow() {
var winPop = new Array();
winPop[winPop.length] = window.open('top_right.html','window1','scrollbars=no,width=235,height=155,left=1000,top=200,screenX=1000,screenY=200');
window.open('top_left.html','window2','scrollbars=no,width=235,height=155,left=325,top=200,screenX=325,screenY=200');
window.open('bottom_left.html','window3','scrollbars=no,width=235,height=155,left=325,top=600,screenX=325,screenY=600');
window.open('bottom_right.html','window4','scrollbars=no,width=235,height=155,left=1000,top=600,screenX=1000,screenY=600');
window.open('center_page.html','window5','scrollbars=no,width=235,height=155,left=660,top=450,screenX=660,screenY=450');
}
What you need is
var winPop;
function newWindow() {
winPop = [
open(
'top_right.html',
'window1',
'scrollbars=no,width=235,height=155,left=1000,top=200,screenX=1000,screenY=200'
),
open(
'top_left.html',
'window2',
'scrollbars=no,width=235,height=155,left=325,top=200,screenX=325,screenY=200'
),
open(
'bottom_left.html',
'window3',
'scrollbars=no,width=235,height=155,left=325,top=600,screenX=325,screenY=600'
),
open(
'bottom_right.html',
'window4',
'scrollbars=no,width=235,height=155,left=1000,top=600,screenX=1000,screenY=600'
),
open(
'center_page.html',
'window5',
'scrollbars=no,width=235,height=155,left=660,top=450,screenX=660,screenY=450'
)
];
}
This is a scoping issue (as well as you not actually adding the windows to the array :|), winPop needs to be global, I.e. vard outside of the function.

Make all hyperlinks in the site do nothing

I want to make a script that disables hyperlinks and instead fires a function when one is clicked.
should work as
<a onclick="talk('http://google.com)'></a>
Is there a way to know when the wants to redirect and instead run "talk()" or display an alert window?

var anchors = document.getElementsByTagName('a');
for (var a = 0; a < anchors.length; a++){
anchors[a].href = "javascript:talk('" + anchors[a].href + "');";
}
Use some discretion though...

This solution uses (DOM Level 0) event handling instead of touching the href directly.
(function () {
var anchors = document.getElementsByTagName('a'),
i = anchors.length;
while (i--) {
anchors[i].onclick = function () {
talk(this.href);
return false;
};
}
}());
Edit: The benefit of this approach is it's much simpler to put the href back when you want to. Given an anchor tAnchor, you merely need to unset the onclick attribute:
tAnchor.onclick = null

Develop Reference

JavaScript is the programming language of the Web.

Opening each link in a each new window - javascript

You are opening a new window with the name 'new window'. On the second click, you specify the same window. If you use a new name in each call, they should open in separate windows.

Related

How to open all offsite links in a new window except for specific href?

Chrome Extension Top Visited List

How to find links on a page, push them to array and open by each click 5 links from array?

Open multiple javascript popup boxes with one button click

Make all hyperlinks in the site do nothing

Categories

Resources