Reputation: 501
How can I open a new tab using javascript without switching to the new tab?
For example, when a user clicks on a link a new tab is to be opened, but the user should stay on the current tab.
Upvotes: 41
Views: 101722
Reputation: 667
var isMobile = false;
if (
/(android|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|ipad|iris|kindle|Android|Silk|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|series(4|6)0|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(
navigator.userAgent
) ||
/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp( i|ip)|hs\-c|ht(c(\-| |_|a|g|p|s|t)|tp)|hu(aw|tc)|i\-(20|go|ma)|i230|iac( |\-|\/)|ibro|idea|ig01|ikom|im1k|inno|ipaq|iris|ja(t|v)a|jbro|jemu|jigs|kddi|keji|kgt( |\/)|klon|kpt |kwc\-|kyo(c|k)|le(no|xi)|lg( g|\/(k|l|u)|50|54|\-[a-w])|libw|lynx|m1\-w|m3ga|m50\/|ma(te|ui|xo)|mc(01|21|ca)|m\-cr|me(rc|ri)|mi(o8|oa|ts)|mmef|mo(01|02|bi|de|do|t(\-| |o|v)|zz)|mt(50|p1|v )|mwbp|mywa|n10[0-2]|n20[2-3]|n30(0|2)|n50(0|2|5)|n7(0(0|1)|10)|ne((c|m)\-|on|tf|wf|wg|wt)|nok(6|i)|nzph|o2im|op(ti|wv)|oran|owg1|p800|pan(a|d|t)|pdxg|pg(13|\-([1-8]|c))|phil|pire|pl(ay|uc)|pn\-2|po(ck|rt|se)|prox|psio|pt\-g|qa\-a|qc(07|12|21|32|60|\-[2-7]|i\-)|qtek|r380|r600|raks|rim9|ro(ve|zo)|s55\/|sa(ge|ma|mm|ms|ny|va)|sc(01|h\-|oo|p\-)|sdk\/|se(c(\-|0|1)|47|mc|nd|ri)|sgh\-|shar|sie(\-|m)|sk\-0|sl(45|id)|sm(al|ar|b3|it|t5)|so(ft|ny)|sp(01|h\-|v\-|v )|sy(01|mb)|t2(18|50)|t6(00|10|18)|ta(gt|lk)|tcl\-|tdg\-|tel(i|m)|tim\-|t\-mo|to(pl|sh)|ts(70|m\-|m3|m5)|tx\-9|up(\.b|g1|si)|utst|v400|v750|veri|vi(rg|te)|vk(40|5[0-3]|\-v)|vm40|voda|vulc|vx(52|53|60|61|70|80|81|83|85|98)|w3c(\-| )|webc|whit|wi(g |nc|nw)|wmlb|wonu|x700|yas\-|your|zeto|zte\-/i.test(
navigator.userAgent.substr(0, 4)
)
) {
isMobile = true;
}
if (isMobile) {
window.location.assign(url);
} else {
window.open(url);
}
Upvotes: 0
Reputation: 688
(function(a) {
document.body.appendChild(a);
a.setAttribute('href', location.href);
a.dispatchEvent((function(e) {
e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
true, false, false, false, 0, null);
return e
}(document.createEvent('MouseEvents'))))
}(document.createElement('a')))
Upvotes: 2
Reputation: 41
For me, using
window.open("https://stackoverflow.com");
worked perfectly. What this does depends on what browser you are using, what operating system, and your personal preferences.
Chrome, Internet Explorer, and Firefox all opened a new tab. Sorry if this doesn't work for you.
(Just realized that this is an old thread)
Upvotes: 1
Reputation: 23
Post is old but without any 100% correct answer.
SOLUTION FOR ALL BROWSERs:
you can open new tab to same domain URLs via :
window.open("newurl.php", "_blank");
and for cross-domain new tabs, you must create a simple local script, like this :
in new file "redirect.php" you pass a parameter (target new tab url ) like this
<?php
$newURL=$_GET['u'];
header('Location: '.$newURL);
؟>
and you can create a new tab with any target url with :
window.open("redirect.php?u=http://www.google.com", "_blank");
:)
its my solution in my website. and work with any
Upvotes: -3
Reputation: 8269
Unfortunately, you can't do this in ALL browsers, but you can do this in Chrome if you implement browser's extension. How to manipulate with tabs in Chrome by javascript:
http://code.google.com/chrome/extensions/tabs.html
chrome.tabs.create(object createProperties, function callback)
Creates a new tab. Note: This function can be used without requesting the 'tabs' permission in the manifest.
Parameters
**createProperties** ( object )
**windowId** ( optional integer )
The window to create the new tab in. Defaults to the current window.
**index** ( optional integer )
The position the tab should take in the window. The provided value will be clamped to between zero and the number of tabs in the window.
**url** ( optional string )
The URL to navigate the tab to initially. Fully-qualified URLs must include a scheme (i.e. 'http://www.google.com', not 'www.google.com'). Relative URLs will be relative to the current page within the extension. Defaults to the New Tab Page.
**selected** ( optional boolean )
Whether the tab should become the selected tab in the window. Defaults to true
pinned ( optional boolean )
Whether the tab should be pinned. Defaults to false
**callback** ( optional function )
Upvotes: 4
Reputation: 1074088
Unfortunately, you can't currently do that -- but you can get close. You can open a new window, and if you do that without specifying any window dimensions or window features, most modern browsers will open a new tab instead (depending on the user's preferences, but then, you want to do what the user prefers anyway, right?). So just window.open(url)
or window.open(url, name)
if you're going to use the name for something. Be sure to do this in direct response to a user-initiated event, otherwise the browser's pop-up blocker will probably...block the pop-up. :-)
Regarding keeping focus on your window...good luck with that. You can call window.focus()
after window.open(...)
, but in my experience it doesn't usually work.
Throwing it out there: If you make the thing the user interacts with a genuine link with a URL, the user can decide whether to open it in a new tab, a new window, whatever and whether to give it focus (if they're sophisticated enough to know Shift+Click and Ctrl+Shift+Click, or the right-click menu).
Upvotes: 17
Reputation: 1665
The web browser automatically focuses on the new tab, but you can call the focus back:
function openWindow( url )
{
window.open(url, '_blank');
window.focus();
}
<a href="http://www.example.com/" onclick="javascript:openWindow(this.href);return false;">Click Me</a>
Upvotes: 50
Reputation: 1901
This is user specific settings, you cannot change this behavior from JS.
Upvotes: 2