I loves me some jQuery – without it I probably wouldn’t write any JavaScript at all (seriously, I hate the stuff). Anyway, today I needed to add some “open in new window” links to an internal application using jQuery. Being the Standardista I am, I wanted to make it a)Accessible, and b) Unobtrusive . If the user has JavaScript disabled (it happens, even on “controlled”, intranet environments), the link should just go to the new page anyway — new window be damned.
My first attempt (below) didn’t work as expected. The following code takes all <a>
tags with a class of “newwindow” and applies an onclick event to open a new window.
$(function(){ $('a.newwindow').click(function(){ var w = window.open($(this).href(), 'newWindow', ''); return false; }); });
Nothing would happen with the above, because of the return false;
. Removing return false;
would open a new window, but also send the opening window to the new page. In the end, the following worked the way I wanted:
$(function(){ $('a.newwindow').click(function(){ var w = newWindow($(this).href(), 'newWindow', ''); return false; }); }); function newWindow(url, wName, opts){ w = window.open(url, wName, opts); return true; }
Basically the “heavy lifting” was moved to a seperate function. It’s slightly longer to type, but not exactly finger-breaking stuff. No doubt some bright-spark could tell me an even betterway (feel free!), but this’ll do for now.