This has me really stymied - I am writing some HTML to a page using jQuery. Within that HTML is a basic link:
<a href="http://someurl.com" target="_blank" class="external-link">Link Text</a>
The issue is that for some reason, on certain mobile devices (Google Pixel and some iPhones), the link will NOT open in a new tab (either Chrome or Safari). So I tried doing it with JavaScript, using a click event on .external-link - same issue. It just opens in the same browser window on these problematic devices (works fine on mine).
I have confirmed that either way (target="_blank" or JS) does work on other multiple devices, including my Android phone. There are no settings that I can see in Chrome/Safari on these devices where it is not working that would be causing this behavior.
Any guesses as to the issue?
In modern browsers about:blank
as target should do the trick.
Used it as target for window.open
in 2018 or in the end of 2017 for Desktop/Mobile/WebView app (probably _blank
didn't work as expected across browsers back then).
Clarifications about spec or browser source code according to which it works and compatibility table link are welcome.
Edit 01 Feb. 2021: Major browsers and weird edge cases. window.open
fully hangs Firefox on some devices.
// common mobile browsers
var link = document.createElement('a');
link.setAttribute('rel', 'noopener noreferrer');
link.setAttribute('target', 'about:blank');
link.setAttribute('href', query);
link.click();
// other custom browsers
// noopener,noreferrer - https://stackoverflow.com/a/46958731/6357894
window.open(query, 'about:blank', 'noopener');
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With