Posted By

jonhenshaw on 06/26/07


Tagged

window blank open new external rel target


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

luman
basicmagic
faugustin


Open New Window Using REL External Instead of Deprecated Target Attribute


 / Published in: JavaScript
 

URL: http://www.456bereastreet.com/archive/200610/opening_new_windows_with_javascript_version_12/

Excellent Script for opening new windows from links while adhering to modern HTML/XHTML standards. Simple put rel="nofollow" in the anchor and link to the script within the HEAD.

I prefer to remove the text that states the link opens in an external windows. To do that, simply change this part of the last line from this: ("rel","external"," (external website, opens in a new window)")

to this: ("rel","external","")

  1. /*
  2. JSTarget function by Roger Johansson, www.456bereastreet.com
  3. */
  4. var JSTarget = {
  5. init: function(att,val,warning) {
  6. if (document.getElementById && document.createElement && document.appendChild) {
  7. var strAtt = ((typeof att == 'undefined') || (att == null)) ? 'class' : att;
  8. var strVal = ((typeof val == 'undefined') || (val == null)) ? 'non-html' : val;
  9. var strWarning = ((typeof warning == 'undefined') || (warning == null)) ? ' (opens in a new window)' : warning;
  10. var oWarning;
  11. var arrLinks = document.getElementsByTagName('a');
  12. var oLink;
  13. var oRegExp = new RegExp("(^|\\s)" + strVal + "(\\s|$)");
  14. for (var i = 0; i < arrLinks.length; i++) {
  15. oLink = arrLinks[i];
  16. if ((strAtt == 'class') && (oRegExp.test(oLink.className)) || (oRegExp.test(oLink.getAttribute(strAtt)))) {
  17. oWarning = document.createElement("em");
  18. oWarning.appendChild(document.createTextNode(strWarning));
  19. oLink.appendChild(oWarning);
  20. oLink.onclick = JSTarget.openWin;
  21. }
  22. }
  23. oWarning = null;
  24. }
  25. },
  26. openWin: function(e) {
  27. var event = (!e) ? window.event : e;
  28. if (event.shiftKey || event.altKey || event.ctrlKey || event.metaKey) return true;
  29. else {
  30. var oWin = window.open(this.getAttribute('href'), '_blank');
  31. if (oWin) {
  32. if (oWin.focus) oWin.focus();
  33. return false;
  34. }
  35. oWin = null;
  36. return true;
  37. }
  38. },
  39. /*
  40. addEvent function from http://www.quirksmode.org/blog/archives/2005/10/_and_the_winner_1.html
  41. */
  42. addEvent: function(obj, type, fn) {
  43. if (obj.addEventListener)
  44. obj.addEventListener(type, fn, false);
  45. else if (obj.attachEvent) {
  46. obj["e"+type+fn] = fn;
  47. obj[type+fn] = function() {obj["e"+type+fn]( window.event );}
  48. obj.attachEvent("on"+type, obj[type+fn]);
  49. }
  50. }
  51. };
  52. JSTarget.addEvent(window, 'load', function(){JSTarget.init("rel","external"," (external website, opens in a new window)");});

Report this snippet  

Comments

RSS Icon Subscribe to comments
Posted By: eroteme on July 12, 2007

The above is obviously meant to be a thorough and accessible option but there is a much quicker way using jQuery:

$("//a[@rel='external']").attr("target","_blank");

Posted By: pleer on October 15, 2010

I have developed a WordPress plugin in case anyone wants a quick fix for this: http://www.pleer.co.uk/wordpress/plugins/rel-external

You need to login to post a comment.