Open link in new tab when user clicks - javascript

I want to create a jQuery script that opens a specific url in a new tab if the user clicks somewhere (no matter where). After that, the user should be able to click anywhere without getting a new tab at every click again.
Unfortunately I have no idea how to create such a script, and therefore I would appreciate all your answears :)

You can use the .one() event like
$(window).one('click', function() {
var url = "http://google.com";
window.open(url, "_blank");
})
_blank in window.open() is used to open the link in a new tab.
DEMO
Refer to following links for documentation on .one() and window.open()

$(window).one('click', function() {
var url = "http://google.com";
window.open(url, "_blank");
})

Related

How to add target=“_blank” to location.href using MVC? [duplicate]

I am using this bit of jQuery code to get href of the link:
var url = $(this).attr('href');
-- and this bit of code to go to that href:
window.location = url;
Everything is just the way I want it, except the new page opens in the same window as the previous one, and I want it to open in a new window or tab (something that in plain html would have been achieved by using target="_blank" formula).
Question: How can I open the href in the new window or tab with jQuery?
Thank you for your help!
You need to open a new window:
window.open(url);
https://developer.mozilla.org/en-US/docs/DOM/window.open
Use,
var url = $(this).attr('href');
window.open(url, '_blank');
Update:the href is better off being retrieved with prop since it will return the full url and it's slightly faster.
var url = $(this).prop('href');
Question: How can I open the href in the new window or tab with
jQuery?
var url = $(this).attr('href').attr('target','_blank');
The .ready function is used to insert the attribute once the page has finished loading.
$(document).ready(function() {
$("class name or id a.your class name").attr({"target" : "_blank"})
})
Detect if a target attribute was used and contains "_blank". For mobile devices that don't like "_blank", this is a reliable alternative.
$('.someSelector').bind('touchend click', function() {
var url = $('a', this).prop('href');
var target = $('a', this).prop('target');
if(url) {
// # open in new window if "_blank" used
if(target == '_blank') {
window.open(url, target);
} else {
window.location = url;
}
}
});
If you want to create the popup window through jQuery then you'll need to use a plugin. This one seems like it will do what you want:
http://rip747.github.com/popupwindow/
Alternately, you can always use JavaScript's window.open function.
Note that with either approach, the new window must be opened in response to user input/action (so for instance, a click on a link or button). Otherwise the browser's popup blocker will just block the popup.
Try using the following code.
$(document).ready(function(){
$("a[#href^='http']").attr('target','_blank');
});
url='/controller/action';
window.open(location.origin+url,'_blank');

How open 2 links in new tabs?

I use this code to open 2 sites in new tabs in browser
$("#mylink").on('click', '#one', function () {
window.open('registration.php', '_blank');
window.open('readme.php', '_blank');
but when I click on link, second link has bet blocked as popup.
How to open 2 sites contemporaneously?
P.S. If this is not possible, how open second link in current browser tab?
Unfortunately it's not possible to "unblock" it as a popup, as far as I know. It would be easier to just give 2 links.
You can use _self as parameter to open in the same window. i.e.
$("#mylink").on('click', '#one', function () {
window.open('registration.php', '_blank');
window.open('readme.php', '_self');
}

How do you create a link which when clicked takes you to a page and also opens a new tab going to another url?

I want to have a link which when clicked preforms two actions:
redirects the current tab of the browser to url A.
opens a new tab directing the browser to url B
How can I do this? Is there HTML for this? Should I use javascript?
You would need to use javascript to achieve this, something along the lines of this:
$('#foo').click(function(e) {
e.preventDefault(); // stop the normal link behaviour so you can open a new window
window.open('http://foo.com/new-page'); // open new tab
window.location.assign($(this).prop('href')); // go to new page in current tab
});
Without jQuery
link // add onclick event
<script>
function f(){
document.location='/a.html'; // open in same tab
window.open('/b.html','_blank'); // open new tab
}
</script>

Opening an url in a new tab instead of a popup (after click)

The user clicks a context-menu to create a new item, the item is saved async and a url is opened in a new tab when save is done. Thats what I want but Chrome is opening the url in a popup instead of a new tab. When opening the window outside the saveasync-then-handler it works fine (the commented code), but not inside. Anything I can do get the same behaviour inside the handler? I have tried using open.bind(this) but that didn't help...
var open = function() {
var win = window.open('/page', '_blank');
win.focus();
};
client.SaveAsync().then(open); // This doesn't work, opens in a popup window
open(); // This works, opens in a new tab
Have the same issue, it's browser protection.
Managed to solve it with a workaround:
var win = window.open('/page', '_blank');
client.SaveAsync().then(function() {
win.open('/page', '_self');
});
The trick is that it works when it's not inside an async request like a response of a http request, so we open it before the request and redirect it after we get the response.

How to open a new window in the same page

I have a button:
<button>Click</button>
I want click it and open a new window in the same page, I bind the click event an event handle:
$('button').click(function () {
var newurl="http://" + window.location["host"] + ";
window.open(newurl, '_parent');
})
But is always open in new tab or new window, the second parameter I have try _self _top.
I even have try window.location.href(newurl)
So how can I solve this problem?Does it matter with browser or OS? I view it in Mac OS's firefox and chrome.
Well that's not possible technically, it also depends on browser tab settings, window settings and third party tab manipulation plugins or addons.
Update
OP has cleared the confusion of all through his comment below his question, this is what you need to set a new url for current window:
$('button').click(function () {
var newurl="http://" + window.location["host"];
window.location.href = newurl; // or simply window.location
})
window.location =newurl; will open a new window replacing the parent
Have you tried this?
<script type="text/javascript">
window.open ('test.htm','_self',false)
</script>
If you mean you want to replace the current page, window.location = newLocation; will do.
If you want a modal popup, try JQuery UI Dialog.

Categories