Web app opens link in Safari instead of inside the existing view

Question

I have added a web app to the Home page.

When I open the app in short cut, its looks is consistent with other native. e.g. the typical Safari tabbar disappear. The url bar is hidden. etc

On the main page, I have a number of tag and links to other pages within the same app. Typically they are something like this

<a class="content" href="/myapp/16270001">
   <span class="name" style="word-wrap: break-word;">Test Link </span>

</a>

When I click on the link, it will jump right into Safari and open http://myapp.com/myapp/16270001, instead of opening up in original view.

How can I make the follow the link action remain in the app's View?

Answer 1

Then you add to homescreen web page it became a standalone app. You can check this state is iOS by navigator.standalone flag. Try 4 years old github gist. I used it and it works. You can use it by bower:

bower install --save iosweblinks

P.S. My modified script for prevent opening links in Safari in standalone mode:

(function (standalone) {

    if (!standalone) {
        return;
    }

    document.addEventListener('click', function (e) {
        var element = e.target,
            href = '';

        while (!/^(a|html)$/i.test(element.nodeName)) {
            element = element.parentNode;
        }

        if (element.getAttribute) {
            href = element.getAttribute('href');

            if ('' !== href && '#' !== href && null !== href && (!element.protocol || element.protocol !== 'tel:')) {
                e.preventDefault();
                window.location = element.href;
            }
        }
    }, false);

}(window.navigator.standalone));