157

将图标添加到主屏幕后,我遇到了网络问题。如果从主屏幕启动 Web,所有链接都将在 Safari 的新窗口中打开(并失去全屏功能)。我该如何预防?我找不到任何帮助,只有同样的未回答的问题。

4

20 回答 20

111

我在iWebKit框架中找到了 JavaScript 解决方案:

var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
    a[i].onclick=function()
    {
        window.location=this.getAttribute("href");
        return false
    }
}
于 2010-05-24T18:00:41.357 回答
96

这里的其他解决方案要么不考虑外部链接(您可能想在 Safari 中打开外部链接),要么不考虑相对链接(其中没有域)。

html5 mobile-boilerplate 项目链接到此要点,该要点对此主题进行了很好的讨论:https ://gist.github.com/1042026

这是他们提出的最终代码:

<script>(function(a,b,c){if(c in b&&b[c]){var d,e=a.location,f=/^(a|html)$/i;a.addEventListener("click",function(a){d=a.target;while(!f.test(d.nodeName))d=d.parentNode;"href"in d&&(d.href.indexOf("http")||~d.href.indexOf(e.host))&&(a.preventDefault(),e.href=d.href)},!1)}})(document,window.navigator,"standalone")</script>
于 2011-11-17T19:34:50.963 回答
47

如果你使用 jQuery,你可以这样做:

$("a").click(function (event) {
    event.preventDefault();
    window.location = $(this).attr("href");
});
于 2011-04-01T04:45:27.140 回答
21

这适用于 iOS 6.1 和 Bootstrap JS 链接(即下拉菜单等)

$(document).ready(function(){
    if (("standalone" in window.navigator) && window.navigator.standalone) {
      // For iOS Apps
      $('a').on('click', function(e){
        e.preventDefault();
        var new_location = $(this).attr('href');
        if (new_location != undefined && new_location.substr(0, 1) != '#' && $(this).attr('data-method') == undefined){
          window.location = new_location;
        }
      });
    }
  });
于 2013-02-08T03:18:25.760 回答
20

这是一个老问题,这里的许多解决方案都使用 javascript。从那时起,iOS 11.3 已经发布,您现在可以使用范围成员了。范围成员是一个 URL,就像该范围"/"下的所有路径都不会打开新页面一样。

范围成员是一个字符串,表示此 Web 应用程序的应用程序上下文的导航范围。

这是我的例子:

{
  "name": "Test",
  "short_name": "Test",
  "lang": "en-US",
  "start_url": "/",
  "scope": "/",
  ...
}

您还可以在此处阅读有关它的更多信息。我还建议使用将提供此功能的生成器。

如果您指定范围,一切都会像 Android 一样按预期工作,超出范围的目的地将在 Safari 中打开——带有一个返回按钮(状态栏中的小按钮)到您的 PWA。

于 2018-04-02T01:40:31.687 回答
5

根据 Davids 的回答和 Richards 的评论,您应该执行域检查。否则,您的 Web 应用程序中也会打开指向其他网站的链接。

$('a').live('click', function (event)
{      
    var href = $(this).attr("href");

    if (href.indexOf(location.hostname) > -1)
    {
        event.preventDefault();
        window.location = href;
    }
});
于 2011-10-24T09:53:31.840 回答
5

如果使用 jQuery Mobile,您将在使用 data-ajax='false' 属性时体验到新窗口。事实上,只要 ajaxEnabled 被关闭、通过外部链接、通过 $.mobile.ajaxEnabled 设置或通过具有 target='' 属性,就会发生这种情况。

您可以使用以下方法修复它:

$("a[data-ajax='false']").live("click", function(event){
  if (this.href) {
    event.preventDefault();
    location.href=this.href;
    return false;
  }
});

(感谢 Richard Poole 的 live() 方法 - 没有使用 bind())

如果您已全局关闭 ajaxEnabled,则需要删除 [data-ajax='false']。

这花了我很长时间才弄清楚,因为我希望它是一个 jQuery Mobile 特定的问题,实际上是 Ajax 链接实际上禁止了新窗口。

于 2012-08-07T12:23:34.390 回答
3

此代码适用于 iOS 5(它适用于我):

在头部标签中:

<script type="text/javascript">
    function OpenLink(theLink){
        window.location.href = theLink.href;
    }
</script>

在您要在同一窗口中打开的链接中:

<a href="(your website here)" onclick="OpenLink(this); return false"> Link </a>

我从这条评论中得到了这段代码:iphone web app meta tags

于 2012-04-07T14:25:07.753 回答
3

当目标明确设置为“_blank”时,也许您应该允许在新窗口中打开链接:

$('a').live('click', function (event)
{      
    var href = $(this).attr("href");

    // prevent internal links (href.indexOf...) to open in safari if target
    // is not explicitly set_blank, doesn't break href="#" links
    if (href.indexOf(location.hostname) > -1 && href != "#" && $(this).attr("target") != "_blank")
    {
        event.preventDefault();
        window.location = href;
    }

});
于 2012-04-26T09:39:56.487 回答
3

我找到了一个非常完整和高效的方法,因为它检查是否仅在独立的 WebApp 下运行,无需 jQuery 即可工作,而且也很简单,仅在 iOS 8.2 下测试过:

保持独立:防止打开 Mobile Safari 的独立 Web 应用程序中的链接

于 2015-07-14T01:13:52.657 回答
2

您也可以几乎正常地进行链接:

<a href="#" onclick="window.location='URL_TO_GO';">TEXT OF THE LINK</a>

你可以删除哈希标签和href,它所做的一切都会影响外观。

于 2012-10-29T12:05:25.500 回答
2

这就是在 iOS 6 上对我有用的东西(对 rmarscher 的回答非常轻微的改编):

<script>                                                                
    (function(document,navigator,standalone) {                          
        if (standalone in navigator && navigator[standalone]) {         
            var curnode,location=document.location,stop=/^(a|html)$/i;  
            document.addEventListener("click", function(e) {            
                curnode=e.target;                                       
                while (!stop.test(curnode.nodeName)) {                  
                    curnode=curnode.parentNode;                         
                }                                                       
                if ("href" in curnode && (curnode.href.indexOf("http") || ~curnode.href.indexOf(location.host)) && curnode.target == false) {
                    e.preventDefault();                                 
                    location.href=curnode.href                          
                }                                                       
            },false);                                                   
        }                                                               
    })(document,window.navigator,"standalone")                          
</script>
于 2013-08-01T21:01:17.863 回答
2

这是 Sean 的稍微改编的版本,它阻止了后退按钮

// this function makes anchor tags work properly on an iphone

$(document).ready(function(){
if (("standalone" in window.navigator) && window.navigator.standalone) {
  // For iOS Apps
  $("a").on("click", function(e){

    var new_location = $(this).attr("href");
    if (new_location != undefined && new_location.substr(0, 1) != "#" && new_location!='' && $(this).attr("data-method") == undefined){
      e.preventDefault();
      window.location = new_location;
    }
  });
}

});

于 2014-01-23T15:02:29.997 回答
1

对于那些使用 Twitter Bootstrap 和 Rails 3 的人

$('a').live('click', function (event) {
  if(!($(this).attr('data-method')=='delete')){
    var href = $(this).attr("href");
    event.preventDefault();
    window.location = href; 
  }   
});

删除链接仍然以这种方式工作。

于 2013-01-10T22:42:37.383 回答
1

我更喜欢在独立网络应用程序模式中打开所有链接,除了那些具有 target="_blank" 的链接。当然,使用 jQuery。

$(document).on('click', 'a', function(e) {
    if ($(this).attr('target') !== '_blank') {
        e.preventDefault();
        window.location = $(this).attr('href');
    }
});
于 2013-08-04T00:39:52.703 回答
1

我用于 iOS Web 应用程序的一种解决方法是我将所有链接(它们是 CSS 按钮)表单提交按钮。所以我打开了一个发布到目标链接的表单,然后输入 type="submit" 不是最好的方法,但这是我在找到这个页面之前想出来的。

于 2014-05-11T18:22:51.240 回答
1

我根据@rmarscher 的答案创建了一个可安装的包,可以在这里找到:

http://github.com/stylr/iosweblinks

您可以使用 bower 轻松安装代码片段bower install --save iosweblinks

于 2014-10-21T15:56:16.450 回答
1

对于那些使用JQuery Mobile,上述解决方案会中断弹出对话框。这将在 webapp 中保留链接并允许弹出窗口。

$(document).on('click','a', function (event) {
    if($(this).attr('href').indexOf('#') == 0) {
        return true;
    }
    event.preventDefault();
    window.location = $(this).attr('href');     
});

也可以这样做:

$(document).on('click','a', function (event){
    if($(this).attr('data-rel') == 'popup'){
        return true;
    }
    event.preventDefault();
    window.location = $(this).attr('href');     
});
于 2016-04-07T14:56:45.197 回答
0

这是我用于页面上所有链接的内容...

document.body.addEventListener(function(event) {
    if (event.target.href && event.target.target != "_blank") {
        event.preventDefault();
        window.location = this.href;                
    }
});

如果您使用的是 jQuery 或 Zepto...

$("body").on("click", "a", function(event) {
   event.target.target != "_blank" && (window.location = event.target.href);
});
于 2012-06-13T07:54:38.613 回答
-3

您可以简单地删除此元标记。

<meta name="apple-mobile-web-app-capable" content="yes">
于 2018-08-29T09:41:07.107 回答