phonegap在浏览器中打开链接
<a target="_blank" data-rel="external" href="http://www.kidzout.com">www.kidzout.com</a>
嗨专家我使用phonegap 2.9.0,我使用上面的代码来打开浏览器中的链接,但它打开它在同一个应用程序……如何打开Safari浏览器?
它打开在同一个应用程序的网站,然后我无法回到应用程序,所以我需要删除应用程序,并再次安装…..
正如在类似的问题中所build议的,根据InAppBrowser文档 ,使用JavaScript调用window.open
, target
参数设置为_system
。
<a href="#" onclick="window.open('http://www.kidzout.com', '_system');">www.kidzout.com</a>
这应该工作,但更好和更灵活的解决scheme将是拦截所有链接的click
事件,并调用window.open
从链接的属性读取的参数。
请记住,您必须安装InAppBrowser插件才能正常工作:
cordova plugin add cordova-plugin-inappbrowser
<a onclick="navigator.app.loadUrl('https://google.com/', { openExternal:true });">Link</a>
适用于Android&PG 3.0
正如其他post所回答的,针对不同的平台有两种不同的select。 我所做的是:
document.addEventListener('deviceready', onDeviceReady, false); function onDeviceReady() { // Mock device.platform property if not available if (!window.device) { window.device = { platform: 'Browser' }; } handleExternalURLs(); } function handleExternalURLs() { // Handle click events for all external URLs if (device.platform.toUpperCase() === 'ANDROID') { $(document).on('click', 'a[href^="http"]', function (e) { var url = $(this).attr('href'); navigator.app.loadUrl(url, { openExternal: true }); e.preventDefault(); }); } else if (device.platform.toUpperCase() === 'IOS') { $(document).on('click', 'a[href^="http"]', function (e) { var url = $(this).attr('href'); window.open(url, '_system'); e.preventDefault(); }); } else { // Leave standard behaviour } }
所以你可以看到我正在检查设备平台,并根据我使用的是不同的方法。 在标准浏览器的情况下,我留下标准的行为。 从现在起,这个解决scheme在Android,iOS和浏览器上都能正常工作,而HTML页面不会被改变,所以它可以把URL表示成标准的锚
<a href="http://stackoverflow.com">
该解决scheme需要InAppBrowser和设备插件
在android和iphone中有两种不同的方式来打开URL。
对于IOS使用下面的代码。
window.open("http://google.com", '_system');
并为android操作系统使用以下代码。
navigator.app.loadUrl("http://google.com", {openExternal : true});
最后这篇文章帮助我在iOS上: http : //www.excellentwebworld.com/phonegap-open-a-link-in-safari-or-external-browser/ 。
打开“CDVwebviewDelegate.m”文件并search“shouldStartLoadWithRequest”,然后将此代码添加到函数的开头:
if([[NSString stringWithFormat:@"%@",request.URL] rangeOfString:@"file"].location== NSNotFound) { [[UIApplication sharedApplication] openURL:[request URL]]; return NO; }
使用navigator.app.loadUrl("http://google.com", {openExternal : true});
对于Android是好的。
通过cordova3.3.0。
如果你碰巧有jQuery,你可以拦截点击链接,如下所示:
$(document).on('click', 'a', function (event) { event.preventDefault(); window.open($(this).attr('href'), '_system'); return false; });
这样你就不必修改html中的链接,这样可以节省很多时间。 我已经使用委托设置了这一点,这就是为什么你看到它被绑定到文档对象,'a'标签作为第二个参数。 这样,所有'a'标签都将被处理,无论何时添加。
当然,你仍然需要安装InAppBrowser插件:
cordova plugin add org.apache.cordova.inappbrowser
window.open('http://www.kidzout.com', '_system');
将工作,但只有当你有安装inappbrowser插件。 要安装,使用terminal,浏览到您的项目中的www文件夹,然后键入:
phonegap plugin add org.apache.cordova.inappbrowser
要么
cordova plugin add org.apache.cordova.inappbrowser
那么你的链接将在浏览器中打开。
这些答案都不够明确,无法在每个平台上打开外部链接。 根据inAppBrowser文档 :
安装
cordova plugin add cordova-plugin-inappbrowser
覆盖window.open(可选,但build议简单)
window.open = cordova.InAppBrowser.open;
如果你不覆盖window.open
,你将会使用本地的window.open
函数,并且不能指望跨平台得到相同的结果。
使用它在默认浏览器中打开链接
window.open(your_href_value, '_system');
请注意,inAppBrowser的目标(这是插件名称暗示的目标)是'_blank'
,而不是'_system'
。
没有上述步骤,我无法获得链接,在默认的浏览器应用程序跨平台打开。
额外的信用
下面是链接的一个示例(实时)点击处理程序:
document.addEventListener('click', function (e) { if (e.target.tagName === 'A' && e.target.href.match(/^https?:\/\//)) { e.preventDefault(); window.open(e.target.href, '_system'); } });
我正在使用PhoneGap Build(v3.4.0),专注于iOS,我需要在我的config.xml中为PhoneGap设置这个条目来识别InAppBrowser插件。
<gap:plugin name="org.apache.cordova.inappbrowser" />
之后,使用window.open(url,target)应该按照预期的方式工作,如此处所述 。
随着cordova5.0和更大的插件InAppBrowser在Cordova插件registry中重命名,所以你应该安装它使用
cordova plugin add cordova-plugin-inappbrowser --save
然后使用
<a href="#" onclick="window.open('http://www.kidzout.com', '_system');">www.kidzout.com</a>
我也遇到了链接不在浏览器上打开的问题,这是我的步骤:
1:安装这个cordova插件。
cordova plugin add cordova-plugin-inappbrowser
2:在html中添加如下所示的打开链接。
<a href="#" onclick="window.open('https://www.google.com/', '_system', 'location=yes');" >Google</a>
3:这是最重要的步骤,因为我面临着很多问题:下载cordova.js
文件并将其粘贴到www
文件夹中。 然后在index.html
文件中对此进行引用。
<script src="cordova.js"></script>
此解决scheme将适用于Android和iPhone环境。