anchor tag not working in safari (ios) for iPhone/iPod Touch/iPad

15,902

Use touchend event via jQuery on all anchor tags. For example:

$(function () {    
    $('a').on('click touchend', function() { 
        var link = $(this).attr('href');   
        window.open(link,'_blank'); // opens in new window as requested 

        return false; // prevent anchor click    
    });    
});

If you want to make the above iPhone and iPad specific function only, check to see if the "device" is an iPad, iPhone, etc. Like so:

$(function () {

    IS_IPAD = navigator.userAgent.match(/iPad/i) != null;
    IS_IPHONE = (navigator.userAgent.match(/iPhone/i) != null) || (navigator.userAgent.match(/iPod/i) != null);

    if (IS_IPAD || IS_IPHONE) {

        $('a').on('click touchend', function() { 
            var link = $(this).attr('href');   
            window.open(link,'_blank'); // opens in new window as requested

            return false; // prevent anchor click    
        });     
    }
});
Share:
15,902

Related videos on Youtube

Monica
Author by

Monica

Updated on September 18, 2022

Comments

  • Monica
    Monica less than a minute

    This is what I have on my HTML5

    <div class="google-play">
        <a href="http://example.com" role="button">
            <img src="img/google-play-btn.png"/>                                                                    
        </a>
    </div>
    

    and works fine on chrome, FF, android but doesn't seem to work on iPad.

    • A-Live
      A-Live
      And by not working you mean what exactly ?
  • Mike Barwick
    Mike Barwick almost 9 years
    Yes ma'am! Cross-platform solution my friend. :)
  • Monica
    Monica almost 9 years
    But how do I make it open in a new page? This opens on the same page. Just what if I want to open in a new page?
  • Ben Saufley
    Ben Saufley over 8 years
    Why not click tap? Touchend may run the risk of having someone lift their finger from a drag and triggering it, right?
  • Mike Barwick
    Mike Barwick over 8 years
    Because tap requires jQuery Mobile, no?