如何增加电话号码?

我想在HTML文档中标记一个电话号码为可调用链接。我读过微格式方法,我知道,tel:方案将是标准的,但实际上无处实现。

据我所知,Skype定义了skype:callto:,后者已经获得了一些流行。我认为,其他公司要么有其他计划,要么就跳上了callto:列车。

什么是标记电话号码的最佳实践,以便尽可能多的人使用VoIP软件只需点击链接就可以接听电话?

额外的问题:有人知道紧急号码的并发症吗,比如美国的911或德国的110 ?

欢呼,

微软NetMeeting采用WinXP下的callto:方案。这个问题表明Microsoft Office Communicator将处理tel:方案,而不是callto:方案。好,雷蒙德!

现在两年半过去了。这似乎可以归结为你想用这个数字做什么。在移动环境中,tel:是可行的方法。如果你认为你的用户更多是Skype用户(callto:),或者更有可能安装谷歌Voice (tel:)之类的软件,那就取决于你了。我个人的观点是,有疑问时使用tel:(与@Sidnicious的回答一致)。

更新3:用户@rybo111指出,Chrome中的Skype同时也加入了tel:的潮流。我无法验证这一点,因为没有机器拥有这两者,但如果这是真的,这意味着我们终于有了一个赢家:tel:

471160 次浏览

移动Safari (iPhone &iPod Touch)使用tel:方案。

如何从iPhone上的网页拨打电话号码?< / >

由于skype默认支持callto:(在skype设置中设置),其他人也支持它,我建议使用callto:而不是skype:

我保留这个答案是为了“历史”目的,但不再推荐它了。请看上面@Sidnicious的回答和我的更新2。

因为这看起来像是电话和电话之间的平局,我想抛出一个可能的解决方案,希望你的评论能让我回到光明的道路上;-)

使用callto:,因为大多数桌面客户端都会处理它:

<a href="callto:0123456789">call me</a>

然后,如果客户端是iPhone,替换链接:

window.onload = function () {
if (navigator.userAgent.match (/iPhone/i)) {
var a = document.getElementsByTagName ("a");
for (var i = 0; i < a.length; i++) {
if (a[i].getAttribute ('href').search (/callto:/i) === 0) {
a[i].setAttribute ('href', a[i].getAttribute ('href').replace (/^callto:/, "tel:"));
}
}
}
};

有人反对这个解决方案吗?我应该从tel:开始吗?

tel:方案是用于20世纪90年代末,并在2000年初与RFC 2806(在2004年被更彻底的RFC 3966淘汰)和持续改善一起记录。在iPhone上支持tel:并不是一个随意的决定。

callto:,虽然由Skype支持,不是一个标准和应该避免,除非特别针对Skype用户。

我吗?我只是开始在你的页面上包括正确形式的tel: uri(不嗅探用户代理),并等待世界上其他的手机赶上:)。

例子:

<a href="tel:+18475555555">1-847-555-5555</a>

正如人们所期望的那样,WebKit对tel:的支持也扩展到了Android移动浏览器——仅供参考

虽然苹果在移动Safari的文档中推荐tel:,但目前(iOS 4.3)它仍然接受callto:。所以我建议在一个通用的网站上使用callto:,因为它既适用于Skype和iPhone,我希望它也适用于Android手机。

更新(2013年6月)

这仍然是一个决定你想要你的网页提供什么的问题。在我的网站上,我提供了tel:callto:链接(后者被标记为Skype),因为Mac上的桌面浏览器不做任何tel:链接,而移动Android不做任何callto:链接。即使谷歌Chrome与谷歌Talk插件不响应tel:链接。尽管如此,我还是更喜欢在桌面上提供这两个链接,以防有人在他们的计算机上遇到了tel:链接的麻烦。

如果网站设计要求我只提供一个链接,我会使用tel:链接,我将尝试在桌面浏览器上将其更改为callto:

我的测试结果:

callto:

  • 诺基亚浏览器:什么都没有发生
  • 谷歌Chrome浏览器:要求运行skype呼叫该号码
  • Firefox:要求选择一个程序来调用该号码
  • IE:要求运行skype呼叫该号码

电话:

  • 诺基亚浏览器:正常工作
  • 谷歌Chrome:什么都没有发生
  • Firefox:“Firefox不知道如何打开此url”
  • IE:无法找到url

最好的办法是从tel开始:它可以在所有手机上使用

然后放入这段代码,它只在桌面上运行,并且只在单击链接时运行。

我使用http://detectmobilebrowsers.com/来检测移动浏览器,你可以使用任何你喜欢的方法

if (!jQuery.browser.mobile) {
jQuery('body').on('click', 'a[href^="tel:"]', function() {
jQuery(this).attr('href',
jQuery(this).attr('href').replace(/^tel:/, 'callto:'));
});
}

所以基本上你涵盖了所有的基础。

Tel:在所有手机上都可以使用该号码打开拨号器

Callto:在您的计算机上工作,从firefox, chrome连接到skype

我在项目中使用了tel:

它可以在Chrome、Firefox、IE9&8、Chrome手机和我的索尼爱立信智能手机上的移动浏览器上运行。

但是callto:在移动浏览器中不起作用。

RFC3966为电话号码定义了IETF标准URI,即'tel:' URI。这是标准。没有类似的标准指定'callto:',这是Skype平台上的一个特殊约定,允许注册URI处理程序来支持它。

这招对我很管用:

1.制作符合标准的链接:

        <a href="tel:1500100900">

2.当检测不到移动浏览器时替换它,用于skype:

$("a.phone")
.each(function()
{
this.href = this.href.replace(/^tel/,
"callto");
});

选择链接通过类替换似乎更有效。 当然,它只对.phone类的锚起作用

我把它放在函数if( !isMobile() ) { ...中,所以它只在检测到桌面浏览器时触发。但是这个可能已经过时了…

function isMobile() {
return (
( navigator.userAgent.indexOf( "iPhone" ) > -1 ) ||
( navigator.userAgent.indexOf( "iPod" ) > -1 ) ||
( navigator.userAgent.indexOf( "iPad" ) > -1 ) ||
( navigator.userAgent.indexOf( "Android" ) > -1 ) ||
( navigator.userAgent.indexOf( "webOS" ) > -1 )
);
}

我将使用tel:(推荐)。但是为了有一个更好的回退/不显示错误页面,我会使用这样的东西(使用jquery):

// enhance tel-links
$("a[href^='tel:']").each(function() {
var target = "call-" + this.href.replace(/[^a-z0-9]*/gi, "");
var link = this;


// load in iframe to supress potential errors when protocol is not available
$("body").append("<iframe name=\"" + target + "\" style=\"display: none\"></iframe>");
link.target = target;


// replace tel with callto on desktop browsers for skype fallback
if (!navigator.userAgent.match(/(mobile)/gi)) {
link.href = link.href.replace(/^tel:/, "callto:");
}
});

这里的假设是,在userAgent-string中有移动戳的移动浏览器支持tel:协议。对于其余部分,我们将链接替换为callto:协议,以便在可用的情况下回退到Skype。

为了抑制不支持协议的错误页,链接指向一个新的隐藏iframe。

不幸的是,它似乎不可能检查,如果url已成功加载在iframe。似乎没有触发错误事件。

我使用正常的<a href="tel:+123456">12 34 56</a>标记,并通过pointer-events: none;使这些链接对桌面用户不可点击

a[href^="tel:"] {
text-decoration: none;
}
.no-touch a[href^="tel:"] {
pointer-events: none;
cursor: text;
}

对于不支持指针事件的浏览器(IE <11),点击可以阻止JavaScript(例子依赖于Modernizr和jQuery):

if(!Modernizr.touch) {
$(document).on('click', '[href^="tel:"]', function(e) {
e.preventDefault();
return false;
});
}

使用jQuery,用适当的callto:tel:方案替换页面上的所有美国电话号码。

// create a hidden iframe to receive failed schemes
$('body').append('<iframe name="blackhole" style="display:none"></iframe>');


// decide which scheme to use
var scheme = (navigator.userAgent.match(/mobile/gi) ? 'tel:' : 'callto:');


// replace all on the page
$('article').each(function (i, article) {
findAndReplaceDOMText(article, {
find:/\b(\d\d\d-\d\d\d-\d\d\d\d)\b/g,
replace:function (portion) {
var a = document.createElement('a');
a.className = 'telephone';
a.href = scheme + portion.text.replace(/\D/g, '');
a.textContent = portion.text;
a.target = 'blackhole';
return a;
}
});
});

感谢@jonas_jonas的想法。需要优秀的findAndReplaceDOMText函数