使用jQuery来检测设备是否可以拨打电话(支持“tel://”协议)
在我的网站上,我有几个这样的链接:
<a href="tel://+12181112222" class="call">218.111.2222</a>
我想使用jQuery(或其他方法)来确定设备是否支持打电话/使用tel://协议。 世界上是否存在这样一种方法?
我想使用一些方法来启用或禁用链接,因为当点击桌面时,我们来到一个页面,比如“Firefox不知道如何打开这个地址,因为协议(tel)没有和任何程序关联。 “
目前,我正在嗅探用户代理并检测它是否是移动设备。 但是,有没有更好的/准确的方法? 像jQuery的$.support.xx
?
if ( (/iPhone|iPod|iPad|Android|BlackBerry/).test(navigator.userAgent) != true ){ $(".call").attr("href", "#"); }
我不确定Android或BlackBerry,但是iOS会自动选取电话号码,然后像下面这样打包: <a href="tel:xxx">xxx</a>
…所以你可以隐藏<div>
包含电话号码的地方,例如1-800-555-5555,然后在页面加载时执行如下操作:
var isTelephone = $("a[href*='tel:']").length > 0;
这可能或不可以移植到其他平台,你必须尝试一下。
有人可能能够find与电话:/ / href的第一个实例,并张贴ajax调用。 如果成功,它应该有一个1的状态,所以什么也不做。 失败时,用tel://find所有的hrefs,并抓取内部html并replace一个标签。
这更多的是一个假设,没有经过检验。
另一个想法是大多数浏览器都有自定义支持电话号码格式的string,如果你放在一个电话号码,你不应该创build一个标签,因为它应该自动完成。
我使用以下方法来检测其可能的电话,然后将非链接元素增强为电话链接:
var probablyPhone = ( (/iphone|android|ie|blackberry|fennec/).test (navigator.userAgent.toLowerCase()) && 'ontouchstart' in document.documentElement );
我排除ipod | ipad,因为我知道他们不是电话
这里的关键点是可能的当然,这将返回真实的一些平板设备,但这足够我的目的在非手机触摸设备链接将只是失败 – 我主要是想排除桌面因此触摸事件检测。 我想也检查设备的宽度也会缩小它,但最终没有保证的方式来检测一个移动设备,能够打电话,我已经find了。
一些有限的解决scheme可以成为检测一些纯手机的一种方法。 但不是所有可能的:
(function(a) { window.isPhone = /\bi?Phone\b|(?=.*\bAndroid\b)(?=.*\bMobile\b)|(?=.*\bAndroid\b)(?=.*\bSD4930UR\b)/i.test(a); })(navigator.userAgent || navigator.vendor || window.opera); console.info('This device %s make phone calls', window.isPhone ? 'is originally intended to' : 'probably can\'t' );