Standard Compliant Way to Open a New Page (no target tag)


 / Published in: HTML
 

Very simple standard compliant way of opening a page in a new window. Since XHTML 1.0 Strict doesn't allow the target attribute in the tag. This method isn't recommended, use the DOM folks! See "Standard Compliant Way to Open a New Page Function" in my other snippets of code.

  1. <a href="http://address.com/" title="Title Here" onclick="window.open(this.href,'newwin'); return false;">Insert Link Title</a>

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: kaiser79 on January 18, 2008

smaller, fail-safe script: return !window.open(this.href,'newwin');

Posted By: noncon on March 10, 2008

That's all good and everything but you shouldn't be forcing new windows if the user doesn't want it. I especially hate it as well. If I want to open a link in a new window I already know how to do that.

You should only ever use it if you let the user know the link will open in a new window.

Posted By: jatkins on March 20, 2008

I agree with noncon.

It's extremely annoying. Seriously, whenever I site wants to open a new window on me - let's say NASA, they do it a lot - I right click, copy the URI (which usually is a JavaScript call, i.e. javascript:openNASAWindow('externalflash/sts-1/index.html');, open a new tab, paste it into the address field, trim off the openNASAWindow() function, add http://www.nasa.gov/ to the beginning of the URI, and visit the paste. It doesn't take very long, but it's extremely irritating, and very bad usability.

Whilst I agree that if you MUST open a new window, you should use this method, I also believe that you should NEVER open a new window - yes, contradicting my first statement. In 2002, you might have wanted this code, but not now. EVERY major browser supports tabs, including just about every non-major browser. That's IE7 (and 8), Firefox, Opera, Safari. Also, OmniWeb, and Konqueror.

Posted By: neal_grosskopf on May 16, 2008

Could this be trimmed to this? window.open(this.href); return false

Posted By: pgl on November 15, 2008

This would not open a new window if the user already had a window open named "newwin": ie, if this is used for multiple links on a page, it will not open a new window for the second link clicked.

This is extremely annoying if you actually want to view multiple links in separate windows.

The reason is that you are explicitly naming the target window for the link contents to be "newwin". Once you've created this window, clicking another link specifies the same window to hold the contents of the link.

To explicitly define a new window to be opened as the target of the link, use "_blank" as the window name.

Posted By: pgl on November 15, 2008

PS: see http://pgl.yoyo.org/c/using-window-names-wrongly.html for an example.

Posted By: pgl on November 15, 2008

PPS: I wonder if links work in comments. Hmm.

Posted By: pgl on November 15, 2008

They do. In that case, might as well put an example right here (unless of course the HTML is sanitised somehow and the onclick element is removed):

first link

second link

Posted By: pgl on November 15, 2008

Sigh. The onclick element /is/ removed - never mind then.

Posted By: fruehjahr on January 1, 2009

Check this if you are using prototype: http://snipplr.com/view/10796/change-rel-external-to-target-blank-using-prototype/

Posted By: bayxsonic on September 3, 2010

EW! I'd rather use "_blank" than onclick.

Posted By: trusktr on October 21, 2010

I think New windows should only be for sending a user to a different domain in a case when they might not know that that is going to happen.

Posted By: toltmanns on January 6, 2011

My solution has been to use jquery to apply the target attribute to anchors after page load - passes code validation and no javascript where it shouldn't be.

Posted By: robinm on February 9, 2011

Based on the trusktr comment this is what i'm using for our project:

jQuery('a[href^=http]:not(.in)').attr({'target':'_blank'});

Posted By: cssfx on April 28, 2011

Perhaps the most compact solution yet:

onclick="javascript:return !window.open(this.href);"

...or if you're going with jquery, just set the rel="external" to any link you want to open externally. $('a[rel]').click(function() { window.open($(this).attr('href')); });

You need to login to post a comment.