javascript 使用 Cordova/jQuery-mobile 在外部设备浏览器中打开链接
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17395718/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Opening links in external device browser with Cordova/jQuery-mobile
提问by Traveling Tech Guy
I have a bunch of links in my app. I added rel='external' target='_blank'to all of them.
我的应用程序中有一堆链接。我添加rel='external' target='_blank'到所有这些。
In the Ripple emulator, or in a regular desktop browser, this works great. But on my Android (JB 4.2.2) it opens the link in the same window. Hitting "back" takes me back to the app, but everything is screwed and the app does not work as planned (script events do not react), until physically reloaded.
在 Ripple 模拟器或常规桌面浏览器中，这非常有效。但在我的 Android (JB 4.2.2) 上，它会在同一窗口中打开链接。点击“返回”让我回到应用程序，但一切都被搞砸了，应用程序无法按计划运行（脚本事件没有反应），直到物理重新加载。
How do I ensure that a link opens in the device's browser? Do I need to use a Cordova plugin?
如何确保链接在设备的浏览器中打开？我需要使用 Cordova 插件吗？
(I'm using Cordova 2.9.0, jQuery 1.10.1, jQuery Mobile 1.3.1)
（我使用 Cordova 2.9.0、jQuery 1.10.1、jQuery Mobile 1.3.1）
回答by Jason Farnsworth
This has been really fickle with Cordova/PhoneGap in the last few releases, I believe because of the InAppBrowserwork which might be a solution for you.
在最近的几个版本中，Cordova/PhoneGap 的这个问题真的很反复无常，我相信是因为InAppBrowser 的工作可能是你的一个解决方案。
What is working for us to launch in the external browser is:
我们在外部浏览器中启动的工作是：
window.open("http://myurl.com", '_system');
In our case, we want to find all external links and launch them in Safari/Chrome (and keep internal links in our Angular router). This probably isn't the most elegant solution, but we are doing this right now by capturing input events on the links and taking over the behavior like so:
在我们的例子中，我们想要找到所有外部链接并在 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');
}
});
I hope that helps you a bit.
我希望对你有所帮助。
回答by Nicole McCoy
I had issues with Jason Farnsworth's answer still firing the default action after the user returned to the app in iOS. So after a little tweaking of his code I arrived at the following and it behaved as expected.
在用户返回 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;
}
});
回答by rotoxl
There're a few questions like this, but all of them try to use inappbrowser. I've used the following plugin:
有几个这样的问题，但他们都尝试使用inappbrowser。我使用了以下插件：
com.byhook.cordova.chromelauncher
Just install it, as always, through cli:
像往常一样，只需通过 cli 安装它：
cordova plugin add com.byhook.cordova.chromelauncher
And add the following JavaScript code:
并添加以下 JavaScript 代码：
ChromeLauncher.open(url)
This will:
这会：
- put your app in background mode
- open the existing instance of "google chrome for android" browser (according to the code, Google Play is gonna be opened if Chrome browser is not found, but i haven't tested this)
- add a new tab to Chrome browser pointing to the desired URL
- 将您的应用程序置于后台模式
- 打开“google chrome for android”浏览器的现有实例（根据代码，如果没有找到Chrome浏览器，将打开Google Play，但我还没有测试过）
- 向 Chrome 浏览器添加一个指向所需 URL 的新标签
回答by rotoxl
I've searched ages for the correct answer and managed to fix this another way besides the already given answers.
除了已经给出的答案之外，我已经搜索了很多年的正确答案，并设法以另一种方式解决了这个问题。
First of all, older versions of Cordova seem to break when you're using some methods on the newer versions of Android. Updating your Cordova to the latest version will bring some possible migration problems in your current project but is worth the shot of updating. Updated to Cordova 5.0 from 2.8, cost me around half an hour changing the code (just a few fixes required). Rebuilded, deployed and launched succesfully after. The back button made my app crash at the older versions of Cordova. The newer version made it work like a charm with the same line of code. Long story short, update cordova, change a few lines if required and rebuild your beauty.
首先，当您在较新版本的 Android 上使用某些方法时，旧版本的 Cordova 似乎会中断。将您的 Cordova 更新到最新版本会在您当前的项目中带来一些可能的迁移问题，但值得一试。从 2.8 更新到 Cordova 5.0，我花了大约半个小时来更改代码（只需要进行一些修复）。之后成功重建、部署和启动。后退按钮使我的应用程序在旧版本的 Cordova 上崩溃。较新的版本使它像使用相同代码行的魅力一样工作。长话短说，更新cordova，根据需要更改几行并重建您的美丽。
Hope this will help you from not struggeling days like I did.
希望这能帮助你摆脱像我一样挣扎的日子。
回答by WinHtaikAung
You Could just remove target attribute
你可以删除目标属性
Use only "rel" attribute
仅使用“rel”属性
I hope it could solve your problem as i face that problem multiple times.
我希望它可以解决您的问题，因为我多次遇到该问题。
