Home/ Questions/Q 6350849
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-24T21:53:22+00:00

we need a kind of client-side redirection and the only options we have are:

  • 0

we need a kind of client-side redirection and the only options we have are:

  1. window.location
  2. window.open
  3. HTTP 301, 302, 303 responses

window.location doesn’t support opening the target location in a new tab or window. (I think this is related to browsing context)

window.open doesn’t work in Chrome and seems to be dependent upon some client-side configurations made to the browser, which makes it a less favorable option, since we don’t have control on it.

HTTP redirect response doesn’t open a new tab or window, just like window.location.

Any idea?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    After playing around with this for hours last night, I had a flash of inspiration this morning, and I have just tested this solution in FF3, Chrome, IE7 and IE8 – it’s a bit hacky but it works in all.

    <html>

  <head>
    <title>Redirect in a new window</title>
    <script type="text/javascript">
      function doIt () {
        var form = document.createElement('form');
        form.action = 'http://www.google.com/';
        form.target = '_blank';
        document.getElementById('hidden_div').appendChild(form);
        form.submit();
      }
    </script>
    <style>
      #hidden_div {
        display: none;
      }
    </style>
  </head>

  <body>
    <div>
      This is my page content<br />
      <a href="http://www.google.com/">This is a link to Google</a>...<br />
      ...and this button will open Google in a new tab or window: <input type="button" value="Click Me!" onclick="doIt();" />
    </div>
    <div id="hidden_div"></div>
  </body>

</html>

    How It Works

    You need a hidden <div> on your page somewhere that you can get a reference to in JS (no big deal – just create one with display: none).

    When you want to do the redirect, use document.createElement() to create a new <form> element, assign it’s action attribute with the address of the page where you want to take the user, and give it a target attribute as appropriate (I have used _blank in my example above). Then simply append it to your hidden <div> and call it’s submit() method.

    Hey presto, your redirect opens in a new window/tab!

    Unfortunately you are still at the mercy of how the user configures their browser to handle target="_blank" but it will be either a new window or a new tab, and it should work everywhere…

    • 0