Question

175

Blocking pop up while using window.open in javascript

rated 0 times [ 180] [ 5] / answers: 1 / hits: 16544 / 8 Years ago, wed, august 31, 2016, 12:00:00

Actually my real scenario is

When user opens the modal pop up (say bootstrap modal pop up http://getbootstrap.com/javascript/#modals), we need to open a url which is already saved by the user.

So for that I have tried to open with window.open. But this is always blocking me. Is there any way to overcome this?

The following scenarios I have tried.

When I try to open using window.open(link, '_blank'); and if browser has the blocked the pop up, then I restricted by browser to open the url in new tab.

To over come this I have tried like (following) creating anchor link and triggering click event. But this is also not also working.

var link = document.createElement('a');

link.setAttribute('href', url);

link.target=_blank;

var event = document.createEvent('MouseEvents');

                                            event.initMouseEvent('click', true, true, window, 1, 0, 0, 0, 0, false, false, false, false, 0, null);

                                            link.dispatchEvent(event);

Some websites by passing this feature.

For example,
https://www.online.citibank.co.in/.

When I click log in button, a new window is opening. They also doing the same functionality as window.open. But the browser is not blocking citibank new window.

I don't know what is the reason behind this. How to implement this
feature?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

maya

Add To Favorites

Follow

Total Points: 418

Total Questions: 116

Total Answers: 112

Location: Mauritania

Member since Sun, Oct 17, 2021

3 Years ago

answered 8 Years ago christianu · Accepted Answer

It's not clear where/when you're triggering trying to open the link, and judging by your need for using JS, I guess it's not through click of an existing button/link.

The issue I see you having is this:

Even if you create an anchor link in JS/jQuery, and invoke the click() programmatically (I've just tried) - it seems that the browser/popup-blocker still sees it as a popup (as it's done from code, and not a real click).

Doing some digging, it seems there isn't anyway to get round this. I found this quote on another answer on SO:

Popup blockers will typically only allow window.open if used during the processing of a user event (like a click)
source: https://stackoverflow.com/a/9514875/6240567

Anyway, you can use jQuery to create an element and click() it, in one line.
My browser still detects it as a popup, so use it with this caveat in mind

You can do it like so:

Create an a element with jQuery

Simulate clicking the href, using the .click() function (preceded by [0] indexer - TL;DR)

jQuery:

$('<a href=http://your.link.com target=_blank>&nbsp;</a>')[0].click();

or Vanilla JS:

window.open(yourlink.com, _target);

Just put this inside the handler/method for where/when you'd like the link to be clicked.

Hope this helps! :)