How to open a link in a new window and also in a new tab/window with right click?

Question

I have a help link. If a user clicks on it, it opens a new window with fixed width and height. It's working well except that when I right click the link, there is either no options to 'open in a new tab' (in IE) or I can open in a new tab but is directed to an empty page (chrome). Can any one help to make this like a link and also by default open in a new window (not a tab)?

<html>
    <head>
        <title>
        link
        </title>

        <script type="text/javascript">

        function activateHelpView(helpUri) {
            var WindowId = 'SomeWindowId';
            var helpWindow = window.open(helpUri, WindowId, 'width=400,height=500,menubar=no,status=no,scrollbars=no,titlebar=no,toolbar=no,resizable=yes');
            if (helpWindow) {
                (helpWindow).focus();
            }
        }
        </script>
    </head>

    <body>
        <a id='PortOrderPageLearnMoreLink' href='javascript:' title='Learn more' onclick='activateHelpView("http://stackoverflow.com/")'>Learn more</a>

    </body>
</html>

About handling right-click: http://stackoverflow.com/a/2405835/586051 — Rahul Desai, Nov 13 '15 at 03:07

Paul Roub · Accepted Answer · 2015-11-13T03:13:23.880

Use a real link, not the empty javascript: address. The onclick handler can prevent the link from doing anything "normal", but you'll have something for the right-click to work with.

target=_blank is a strong hint that you want the page opened in a new window, but whether that's honored at all -- and whether in a window or a tab -- is out of the page's control.

<script type="text/javascript">
  function activateHelpView(helpUri) {
    var WindowId = 'SomeWindowId';
    var helpWindow = window.open(helpUri, WindowId, 'width=400,height=500,menubar=no,status=no,scrollbars=no,titlebar=no,toolbar=no,resizable=yes');
    if (helpWindow) {
      (helpWindow).focus();
    }
  }
</script>

<a id='PortOrderPageLearnMoreLink' href='http://stackoverflow.com/' title='Learn more' onclick='activateHelpView(this.href); return false;' target='_blank'>Learn more</a>

A more modern way of handling all of this -- particularly if there will be more than one help link -- is to add a class to all of them, and run some JavaScript to add the click handler to each in turn. The HTML stays clean (and with real links, still works if JavaScript is disabled or not loaded).

var helplinks = document.querySelectorAll('.helplink');

for (var i = 0; i < helplinks.length; ++i) {
  helplinks[i].addEventListener('click', activateHelpView);
}

function activateHelpView(event) {
  event.stopPropagation();     // don't let the click run its course
  event.preventDefault();

  var helpUri = this.href;     // "this" will be the link that was clicked
  var WindowId = 'SomeWindowId';
  var helpWindow = window.open(helpUri, WindowId, 'width=400,height=500,menubar=no,status=no,scrollbars=no,titlebar=no,toolbar=no,resizable=yes');
  if (helpWindow) {
    helpWindow.focus();
  }
}

<a id='PortOrderPageLearnMoreLink' 
   href='http://stackoverflow.com/' title='Learn more' 
   class='helplink' target='_blank'>Learn more</a>

StackOverflow snippets aren't allowed to use some of these functions. A working example can be found here.

The new window will be blocked in most browsers because it is sandboxed here on StackOverflow.com :) — Rahul Desai, Nov 13 '15 at 03:08

How to open a link in a new window and also in a new tab/window with right click?

1 Answers1