如何标记电话号码？

tel: 方案是 used in the late 1990s，并在 2000 年初记录了 RFC 2806（在 2004 年被更彻底的 RFC 3966 淘汰）和 continues to be improved。在 iPhone 上支持 tel: 并不是一个武断的决定。

callto:，虽然 Skype 支持，但不是标准，除非专门针对 Skype 用户，否则应避免使用。

我？我只是开始在您的页面上包含格式正确的 tel: URI（无需嗅探用户代理），然后等待世界其他手机赶上 :) 。

例子：

1-847-555-5555

---

我的测试结果：

拨电至：

诺基亚浏览器：没有任何反应

谷歌浏览器：要求运行 Skype 拨打该号码

Firefox：要求选择一个程序来呼叫号码

IE：要求运行Skype拨打号码

电话：

诺基亚浏览器：工作

谷歌浏览器：没有任何反应

Firefox：“Firefox 不知道如何打开此网址”

IE：找不到网址

---

最好的选择是从 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:'));
    });
}

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

电话：适用于所有电话以打开带有号码的拨号器

callto：在您的计算机上工作以从 firefox、chrome 连接到 Skype

---

正如人们所预料的那样，WebKit 对 tel: 的支持也扩展到了 Android 移动浏览器 - 仅供参考

---

我出于“历史”目的保留此答案，但不再推荐它。请参阅上面的@Sidncious' 答案和我的更新 2。

由于它看起来像是 callto 和 tel 家伙之间的平局，我想提出一个可能的解决方案，希望你的评论能让我回到光明的道路上；-)

使用 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: 开始吗？

---

移动 Safari（iPhone 和 iPod Touch）使用 tel: 方案。

How do I dial a phone number from a webpage on iPhone?

---

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: 用于我的项目。

它适用于 Chrome、Firefox、IE9&8、Chrome 手机和我索尼爱立信智能手机上的移动浏览器。

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

---

我会使用 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 中。似乎没有触发任何错误事件。

---

由于 Skype 默认支持 callto:（在 Skype 设置中设置），并且其他人也支持它，因此我建议使用 callto: 而不是 skype: 。

---

尽管 Apple 在他们的 Mobile Safari 文档中推荐 tel:，但目前 (iOS 4.3) 它同样接受 callto:。因此，我建议在通用网站上使用 callto:，因为它适用于 Skype 和 iPhone，而且我希望它也适用于 Android 手机。

更新（2013 年 6 月）

这仍然是决定您希望您的网页提供什么的问题。在我的网站上，我同时提供了 tel: 和 callto: 链接（后者标记为用于 Skype），因为 Mac 上的桌面浏览器不会对 tel: 链接执行任何操作，而移动 Android 不会对 callto: 执行任何操作链接。甚至带有 Google Talk 插件的 Google Chrome 也不响应 tel: 链接。不过，我更喜欢在桌面上同时提供这两个链接，以防有人费心让 tel: 链接在他们的计算机上工作。

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

---

使用 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 function。

---

我使用普通的 <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;
    });
}

---