window.open() 在添加到主屏幕的移动 Safari 网络应用程序中不起作用答案

【问题标题】：window.open() doesn't work in mobile Safari web-app added to home screenwindow.open() 在添加到主屏幕的移动 Safari 网络应用程序中不起作用
【发布时间】：2012-07-22 01:18:36
【问题描述】：

这是我尝试过的所有代码：

select:function(event, ui) {
    window.open(ui.item.value, "_blank");
}

select:function(event, ui) {
    window.location.href = ui.item.value;
}

在网络应用程序模式下，屏幕只是刷新，不会转到该位置。在 Mobile Safari 中，它按预期工作。

这是对 iPhone 上网络应用程序的限制吗？有办法解决吗？

完整代码如下：

<script>
$(document).ready(function() {
    var cct = $('input[name=csrf_token]').val();    
    var searchInput = $('input[name=search]');

    function loadEventsData(onSuccess){
      $.ajax({
        type: 'POST',
        url: '<?php echo site_url('ajax_frontend/getEventsSearch'); ?>',
        dataType: 'json',
        success: onSuccess,
        error: function(XMLHttpRequest, textStatus, errorThrown) { alert(errorThrown); }
      });
    }

    function initializeEventsAutocomplete(data){
      searchInput.addClass('loaded').autocomplete({
      source:data,
      appendTo: '.search_autocomplete',
      minLength:2,
      delay:0,
      selectFirst:false,
      open: function(event, ui) {
        $('ul.events').hide();
        $('.ui-autocomplete').removeAttr('style');
        $('.icon-search').hide();
        $('.icon-close').show();
      },
      close: function(event, ui) {
        val = searchInput.val();
        searchInput.autocomplete("search", val);
        searchInput.focus();
        return false;
      },
      select:function(event, ui) {
        window.location.href = ui.item.value;
        return false;
      }
      });
    }

    $('form').submit(function(e) {
        e.preventDefault();
        searchInput.blur();
    });

    searchInput.keyup(function(){
    if($(this).is(".loaded")) return;
    loadEventsData(initializeEventsAutocomplete);
    });

    $('.icon-close').click(function(e) {
        e.preventDefault();

        $(this).hide();
        $('.icon-search').show();
        searchInput.autocomplete('close');
        $('ul.events').show();
        searchInput.val('');
    });
});
</script>

这里是 JSON（其中一些）：

[{"value":"http:\/\/events.dev\/index.php\/event\/canada-day","label":"Canada Day"},{"value":"http:\/\/events.dev\/index.php\/event\/triathlon-festival","label":"Triathlon Festival"}]

【问题讨论】：

您确定select:function 调用本身没有问题吗？如果你再做一点 JavaScript 而不是打开一个窗口，它会起作用吗？
看来你是对的。我把它放在select:function 之外，它可以工作。但不幸的是，我仍然需要它。我正在使用 jQuery UI 自动完成。知道什么可能会阻止它以及如何克服它吗？
你能完整显示自动完成调用吗？我猜你错过了一些简单的东西，但没有很难确定的代码。
而且，就像我在问题中所说的那样，它确实可以在常规 Mobile Safari 中工作，但不能在全屏 Web 应用程序模式下工作。很奇怪。
@ceejayoz 我已经添加了完整的代码。感谢您的检查！

标签： javascript iphone web-applications

【解决方案1】：

以编程方式 (Javascript) 在 Mobile Safari 中打开一个链接。如果您不能使用标准 html 链接但必须使用 Javascript，则非常理想：

var a = document.createElement("a");
a.setAttribute('href', facebook);
a.setAttribute('target', '_blank');
a.click();

【讨论】：

【解决方案2】：

我想通了。我正在使用以下代码来防止 Web 应用程序中的链接在 Safari 中打开：

https://gist.github.com/1042026

这导致了一些不必要的副作用。为了解决这个问题，我添加了：

event.stopPropagation();

到我的selection:function 区域，它可以正常工作。

【讨论】：