This is easy. Use a delegation. I would use a class rather than
data-outbound selector, because it is more efficient. As well, use
vclick rather than tap. With tap you lose the desktop users or anybody with a bluetooth mouse connected to their device.
Make sure this is a script file referenced from
<head>.
- $(document).on("vclick", ".outbound-link", function (e) {
- this.preventDefault();// Prevent the default browser action
- if (e.type === "click") { return; }// Prevent duplicate action
- window.open(this.href,'_blank');
- });
You will also need
data-ajax="false" or data-rel="external" in the
<a> tag.
Alternately, you can use, say,
data-href rather than
href, and don't have an
href at all. (Do
NOT use
data-href="#") Then you don't need
data-ajax="false". If there is an
href, then JQM will hijack the link and try to AJAX it.
Another alternative is to specify the target in the
<a> tag. You do not then need
data-ajax="false", because JQM won't hijack a link with a target present.
I have a site where I need to send outbound clicks to open in a new
window (yes, I generally understand this is not the recommended
behavior.)
To me, this is absolutely the recommended behavior. You don't waste time re-loading JQM when the user comes back. You don't have to be concerned about the linked site blocking "back". And the user keeps their place on your site. Win, win, win. All links out of a JQM site should use
target.
If you don't need
tap/vclick, then simply add the target to the tag and forget about
data-rel="external" or
"data-ajax="false". You don't need them because JQM has a hands-off policy for links that specify a target.
