CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Jesus Gonzalez
Jesus Gonzalez

Reputation: 411

Anchor target _blank is blocked by browser

I'm trying to understand the following behaviour.

I have created a simple anchor tag:

<a href="/example/link" target="_blank">
    <img src="/images/layout_open.png">
    <span class="open-new-tab">Open in new tab</span>
</a>

Update: These <a> tags are created asynchronously. After an AJAX requests, the JS creates the <a> tags.

Problem is that Google Chrome will instead block the opening tab as if it was an obstrusive popup.

How can I avoid this behaviour? I have read on other StackOverflow questions that I could add the <a> tag a data attribute and through jQuery bind an event to it and using JS I could open a new window.

What I cannot understand is why in my example it is not working, and in other sites it's not being blocked. It's linking to the same domain and host.

I concluded it can be because when I press the span or img, the event will be fired during bubbling phase, then, it is not a direct action, but an indirect action.

What's the cause of this and how can I avoid it?

Thanks

Update:

I think I have found out the solution. The problem is that the images have an onclick event attached to it I didn't earlier. Just like this:

<a href="/example/link" target="_blank">
    <img src="/images/layout_open.png" onclick="showFullImage()">
    <span class="open-new-tab">Open in new tab</span>
</a>

I haven't tried this yet, but as @Siderite suggested, that blocking was not regular browser behaviour. So I think that Google Chrome will mark this as an indirect action.

I will try tomorrow and let you know in Update nr. 2

Thank you all

Upvotes: 2

Views: 6053

Answers (1)

Siderite Zackwehdex
Siderite Zackwehdex

Reputation: 6570

This is not the normal behaviour of a browser, but more likely an extension that tries to aggressively block popups.

Inspect your Chrome extensions by going to the chrome://extensions/ url.

Upvotes: 3

Related Questions