iPhone的Safari Web应用程序中打开新的窗口链接iPhone的Safari Web应用程

2019-05-10 11:31发布

我加入图标到主屏幕后,有网络问题。 如果网站是从主屏幕启动,所有链接将会在Safari新窗口中打开(而失去全屏功能)。 我该如何预防呢? 我找不到任何帮助,只是同样的悬而未决的问题。

Answer 1:

我发现,在JavaScript解决方案iWebKit框架:

var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
    a[i].onclick=function()
    {
        window.location=this.getAttribute("href");
        return false
    }
}


Answer 2:

其他的解决方案无论是在这里不考虑外部链接(你可能要在Safari中打开外部),或不占相对链接(没有在他们的领域)。

HTML5的移动样板项目链接到这个要点这对话题了很好的讨论: 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>


Answer 3:

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

$("a").click(function (event) {
    event.preventDefault();
    window.location = $(this).attr("href");
});


Answer 4:

这是为我工作在iOS 6.1和自举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;
        }
      });
    }
  });


Answer 5:

这是一个老问题,很多解决方案,这里有使用JavaScript的。 自那时以来,iOS的11.3已经发布,你现在可以使用范围成员 。 范围成员就像是一个URL "/" ,其中在该范围内的所有路径将不会打开新的一页。

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

这是我的例子:

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

您还可以阅读更多关于它在这里 。 我也建议使用发电机将提供此功能。

如果指定的范围内,一切都按预期类似的Android,目的地出来的范围将在Safari中打开 - 一个后退按钮(小一个在状态栏),以您的PWA。



Answer 6:

根据戴维斯的回答和理查兹评论,你应该进行域名检查。 否则,链接到其他网站也将在你的web应用程序打开。

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

    if (href.indexOf(location.hostname) > -1)
    {
        event.preventDefault();
        window.location = href;
    }
});


Answer 7:

如果使用jQuery Mobile的使用数据AJAX =“假”属性时,你会体验到新窗口。 事实上,每当ajaxEnabled被关断,即由与外部链路,由$ .mobile.ajaxEnabled设置或由具有目标=“”属性会出现这种情况。

可以使用此解决它:

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

(感谢理查德·普尔的现场()方法 - 不使用绑定工作())

如果您已在全球范围ajaxEnabled了,你将需要删除[数据AJAX =“假”。

这花了我相当长弄清楚,我期待这是一个jQuery Mobile的具体问题,即在事实上,它是Ajax的链接,实际上禁止了新的窗口。



Answer 8:

此代码适用于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应用程序的meta标签



Answer 9:

也许你应该允许在新窗口打开链接时,目标明确设置为“_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;
    }

});


Answer 10:

我发现一个非常完整的,高效的,因为它会检查只在独立Web应用程序在运行,工程没有jQuery和也很简单,只需运行iOS 8.2下进行测试:

保持独立:防止在独立的网络应用程序打开移动Safari浏览器链接



Answer 11:

你也可以做几乎正常链接:

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

你可以删除哈希标签和HREF,它所做的一切它影响美观..



Answer 12:

这是为我工作在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>


Answer 13:

这是稍微适应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;
    }
  });
}

});



Answer 14:

对于那些Twitter的引导和Rails 3

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

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



Answer 15:

我更喜欢打开独立的网络应用模式中的所有环节,除了那些有目标=“_空白”。 当然使用jQuery的。

$(document).on('click', 'a', function(e) {
    if ($(this).attr('target') !== '_blank') {
        e.preventDefault();
        window.location = $(this).attr('href');
    }
});


Answer 16:

我使用的是iOS web应用程序的一个解决方法是,我做了所有的链接(这是由CSS按钮)的形式提交按钮。 所以,我打开它贴到目标链路的形式,然后输入类型=“提交”不是最好的方式,但它是什么,我想通了,我发现这个页面之前。



Answer 17:

我创建了一个凉亭安装包出来的@ rmarscher的答案可以在这里找到:

http://github.com/stylr/iosweblinks

您可以轻松地与凉亭使用安装片断bower install --save iosweblinks



Answer 18:

对于使用这些JQuery Mobile ,上述解决方案打破弹出对话框。 这将让Web应用程序中的链接,并允许弹出窗口。

$(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');     
});


Answer 19:

下面是我使用的页面上的所有链接...

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);
});


Answer 20:

你可以简单地删除这个元标记。

<meta name="apple-mobile-web-app-capable" content="yes">


文章来源: iPhone Safari Web App opens links in new window