【问题标题】:Opening links in external device browser with Cordova/jQuery-mobile使用 Cordova/jQuery-mobile 在外部设备浏览器中打开链接
【发布时间】:2016-02-13 02:31:36
【问题描述】:

我的应用中有很多链接。我给他们都加了rel='external' target='_blank'

在 Ripple 模拟器或常规桌面浏览器中,这非常有效。但在我的 Android (JB 4.2.2) 上,它会在同一个窗口中打开链接。点击“返回”将我带回应用程序,但一切都搞砸了,应用程序无法按计划运行(脚本事件没有反应),直到物理重新加载。

如何确保在设备的浏览器中打开链接?我需要使用 Cordova 插件吗?

(我使用的是 Cordova 2.9.0、jQuery 1.10.1、jQuery Mobile 1.3.1)

【问题讨论】:

    标签: javascript jquery-mobile cordova


    【解决方案1】:

    在最近的几个版本中,Cordova/PhoneGap 确实变化无常,我相信因为 InAppBrowser 的工作可能是您的解决方案。

    我们在外部浏览器中启动的工作是:

    window.open("http://myurl.com", '_system');
    

    在我们的例子中,我们希望找到所有外部链接并在 Safari/Chrome 中启动它们(并将内部链接保留在我们的 Angular 路由器中)。这可能不是最优雅的解决方案,但我们现在正在通过捕获链接上的输入事件并接管如下行为来做到这一点:

            $(document).on('mousedown','a', function(e) {
                e.preventDefault();
                var elem = $(this);
                var url = elem.attr('href');
                if (url.indexOf('http://') !== -1) {
                    window.open(url, '_system');
                }
            });
    

    希望对你有所帮助。

    【讨论】:

    • 请看下面@NicoleMcCoy 的回答,哪个更正确。 IMO 最好也解决这个问题。
    【解决方案2】:

    在用户返回 iOS 应用程序后,Jason Farnsworth 的回答仍然触发默认操作,对此我有疑问。因此,在对他的代码稍作调整后,我得到了以下结果,它的行为符合预期。

    $(document).on('click', 'a', function (e) {
       var elem = $(this);
       var url = elem.attr('href');
       if (url.indexOf('http://') !== -1) {
           e.preventDefault();
           window.open(url, '_system');
           return false;
       }
    });
    

    【讨论】:

      【解决方案3】:

      有几个这样的问题,但他们都尝试使用inappbrowser。我使用了以下插件:

      com.byhook.cordova.chromelauncher
      

      一如既往地通过 cli 安装它:

      cordova plugin add com.byhook.cordova.chromelauncher
      

      并添加以下 JavaScript 代码:

      ChromeLauncher.open(url)
      

      这将:

      1. 将您的应用置于后台模式
      2. 打开已有的“google chrome for android”浏览器实例(根据代码,如果没有找到Chrome浏览器会打开Goog​​le Play,但我没有测试过)
      3. 向 Chrome 浏览器添加一个指向所需 URL 的新选项卡

      【讨论】:

        【解决方案4】:

        除了已经给出的答案之外,我已经在各个年龄段搜索了正确答案并设法以另一种方式解决了这个问题。

        首先,当您在较新版本的 Android 上使用某些方法时,较旧版本的 Cordova 似乎会崩溃。将您的 Cordova 更新到最新版本会在您当前的项目中带来一些可能的迁移问题,但值得一试。从 2.8 更新到 Cordova 5.0,我花了大约半小时更改代码(只需要一些修复)。之后重建、部署和启动成功。后退按钮使我的应用程序在旧版本的 Cordova 上崩溃。较新的版本使它像具有相同代码行的魅力一样工作。长话短说,更新科尔多瓦,根据需要更改几行并重建您的美丽。

        希望这将帮助您摆脱像我一样挣扎的日子。

        【讨论】:

          【解决方案5】:

          你可以删除 目标 属性

          只使用“rel”属性

          我希望它可以解决您的问题,因为我多次遇到这个问题。

          【讨论】:

          • 无法想象这也可以解决您的问题。也许你用别的办法解决了。
          猜你喜欢
          • 1970-01-01
          • 2013-01-22
          • 2013-08-01
          • 1970-01-01
          • 2023-04-02
          • 2014-07-12
          • 2018-02-11
          • 2017-08-06
          • 1970-01-01
          相关资源
          最近更新 更多