On iOS devices using mobile safari your can easily navigate the user to another website or page using ordinary links and the location object. However, if you want to programmatically open a new tab or window then this is not easily done. Sure, if the method of navigation is a link that a user clicks then all we need to do is assign target a value of _blank. But if for instance you want to have a user click a button, run some JavaScript code and depending on the result open a new tab/window with a specified URL then we have to use a trick.
function openTab(url) {
// Create link in memory
var a = window.document.createElement("a");
a.target = '_blank';
a.href = url;
// Dispatch fake click
var e = window.document.createEvent("MouseEvents");
e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
a.dispatchEvent(e);
};
openTab('http://www.google.com'); // will open new tab on iPad and new window on iPhone
This function allows you to do exactly that. We create a link element in memory and assign it a target of ‘_blank’ as well as setting href to our desire URL. After this, we create a mouse event in memory and dispatch a click event on said link. This will tell the browser that a link was clicked and the corresponding action will occur namely the opening of a window or tab.
If have tested this on iPad and iPhone 4S.
If you want to read more about working with event in JavaScript you can start here.
Good Solution is work if you need open new window in tab change this line
e.initMouseEvent(“click”, true, true, window, 0, 0, 0, 0, 0, true, false, false, false, 0, null); a.dispatchEvent(e);};
Simulate ctrl+click open new tab in safari
Yeeeeh! You saved my life!
It works perfectly. Thanks man I was all day looking for this.
Hi,
But the above coding is not working in firefox and ie
Correct. But you should not be using this piece of code with firefox and IE. It is the solution to a problem local to mobile safari on iOS devices.
Hi,
Correct me if I’m wrong but I think this solution no longer works on mobile safari in IOS 7. Do you have the fix for iOS 7 already? I don’t even know where to start. Please let me know. Many Thanks
Can confirm. This trick no longer works in iOS 7.
This solution also broke for me on iOS 7. Has anyone found a solution? Thanks!
Sadly this solution might be broken now. I will have a look at it this weekend at see what might be preventing this from working.
I wasn’t able to use it.
not working on mobile safari IOS 7
if anybody knows solution for IOS 7 then please help
So the deal is that this is a work around for the Safari popup blocker. Any work around like this is going to be closed with newer versions of the browser/OS so that the deficiency that you are taking advantage of in code is also being used by spammers, advertisers, and those of that ilk. An elegant solution is to use JQuery UI dialog widget, which also has the niceness of being cross browser and machine compatible. Have a great day.
Thankz!! It’s working for me!! but how to customize the window size? Can u help with that?
Thanks in advance.
thanks a lot, you save my life