Member Avatar for MDGM

Hi all,

I found a script on dynamic drive that makes all links linking to a page that is on another website open in a _blank window. (http://www.dynamicdrive.com/dynamicindex8/newwindow2.htm)

I have just finished creating a page which has 2 frames:

1) At the top with my logo and menu on it
2) At the bottom which gets it's content using PHP and grabbing the url (index.php?url=) from the address bar.

My question:

How would I edit the script i found on dynamic drive (http://www.dynamicdrive.com/dynamicindex8/newwindow2.htm) in order to find links that link to an external website, and edit the links href to url*

Thanks all :)

p.s. im not great with javascript :P

  • 2 Contributors
  • 3 Replies
  • 190 Views
  • 23 Hours Discussion Span
  • Latest Post Latest Post by MDGM

Dani AI

Generated

Two quick things causing the undefined and the broken URL you’re seeing: (1) missing curly braces after the if means only the very next statement runs conditionally, so subsequent lines run for every <a> (some of which lack href); (2) JavaScript uses + for string concatenation (not .). Also always URL-encode the original URL when you put it into a query string.

Here’s a compact, safe pattern you can drop in and adapt (replace the domain/regex with your own):

function rewriteExternalLinks() {
  var links = document.getElementsByTagName('a');
  var excludeRe = /yourdomain\.com|localhost/i;        // change to suit
  var redirectBase = 'https://yourdomain.com/externallinks/?url=';

  for (var i = 0; i < links.length; i++) {
    var a = links[i];
    var href = a.href;
    if (!href) continue;
    if (/^https?:\/\//i.test(href) && !excludeRe.test(a.hostname) && href.indexOf(redirectBase) === -1) {
      a.href = redirectBase + encodeURIComponent(href);
      a.target = 'framed'; // optional: use frame name suggested by @Member#380484
    }
  }
}
window.onload = rewriteExternalLinks;

Notes and troubleshooting

  • Put the variable assignment and href rewrite inside the same { ... } block so they only run for links that match your test.
  • Use encodeURIComponent(href) so ?, &, #, etc. in the original URL don’t break your query string.
  • If you want the raw attribute value (relative URLs) use a.getAttribute('href') and a.setAttribute('href', ...) instead of a.href.
  • Guard against double-wrapping by checking the link doesn’t already start with your redirect prefix.
  • If it still shows undefined, confirm the script runs after DOM load and inspect console.log(a, a.href) to see which anchors are being processed.

This keeps ’s frame idea working (set target to your frame name) while safely rewriting external hrefs for your PHP wrapper.

Recommended Answers

All 3 Replies

Member Avatar for Member #380484

Easy-breezy...

Instead of having target="_blank" have target="name_of_frame"

I would be using <iframes> instead of old-skool frames, but the same principle applies either way.

<a href="http://google.com" target="framed">Open link</a><br />
<iframe name="framed"></iframe>

You can style iframes like any other html element using CSS -- which is vernice

To excerpt their code

change ...

//2) Target for links that should open in a new window (ie: "_blank", "secwin" etc):
linktarget: "_blank",

... to ...

//2) Target for links that should open in a new window (ie: "_blank", "secwin" etc):
linktarget: "framed", // or the name of your frame-window

Hope this helps ....

Member Avatar for MDGM

Ahh okay that makes sense. The only problem is that the link will expect that the target frame is on the same page, however I need to edit the url of the link and change it like this:

origional:
http://www.google.com

changed to:

So if i change the url I dont need to change the frame because in my externallinks index page the bottom frame takes it's source using PHP's get function out of the address bar so the bottom frame will load the value of url (http://www.google.com)

Member Avatar for MDGM

What I have done so far is added a couple of simple lines in.

Old Code:

assigntarget:function(){
	var rexcludedomains=new RegExp(this.excludedomains.join("|"), "i")
	var all_links=document.getElementsByTagName("a")
	if (this.mode=="auto" || (this.mode=="manual" && this.togglebox.checked)){
		for (var i=0; i<=(all_links.length-1); i++){
			if (all_links[i].hostname.search(rexcludedomains)==-1 && all_links[i].href.indexOf("http:")!=-1)
				all_links[i].target=ddwindowlinks.linktarget

New Code:

assigntarget:function(){
	var rexcludedomains=new RegExp(this.excludedomains.join("|"), "i")
	var all_links=document.getElementsByTagName("a")
	if (this.mode=="auto" || (this.mode=="manual" && this.togglebox.checked)){
		for (var i=0; i<=(all_links.length-1); i++){
			if (all_links[i].hostname.search(rexcludedomains)==-1 && all_links[i].href.indexOf("http:")!=-1)
				all_links[i].target=ddwindowlinks.linktarget
				var origionalhref = all_links[i].href;
				all_links[i].href=''.origionalhref

So by that I have told it to change the href on the link to

but the problem im having is adding the origional href onto the end. I thought that by setting a variable (origionalhref) to the value of the origional link's href it might work but it comes up with undefined so im guessing this syntax is wrong:
var origionalhref = all_links.href;

Any ideas how to fix it? Im basically storing the origional value of the link's href in a variable before changing it, and calling it later in the script when i want to change that link's href.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.