href=tel:555 链接在移动 Safari 中不起作用

Posted

技术标签:

【中文标题】href=tel:555 链接在移动 Safari 中不起作用【英文标题】：href=tel:555 link not working in mobile safari 【发布时间】：2011-12-04 15:34:47 【问题描述】：

我正在设计一个移动页面，并且正在使用以下（我相信是标准的）代码让电话拨打电话号码。 

<a href="tel:555-1234567" class="call"><img src="graphics/call-icon.gif"   ></a>

这在 android 中运行良好，但 Mobile Safari 出现以下错误：

无法打开页面Safari 无法打开页面，因为地址是 无效

【问题讨论】：

您是否尝试从电话号码中删除破折号？ IE。只保留数字。 我正在 ios 模拟器上测试是否相关。 查看此链接***.com/questions/1164004/… 如果您使用的是模拟器并且您没有手机应用程序，它将无法工作。 ***.com/a/13373055/317832 【参考方案1】： 
<a class="font-13 color-theme" onclick="window.open('tel:+84935002102');">Call</a>

【讨论】：

【参考方案2】：

2021 在这里更新，我正在为 android 和 ios 构建一个 Ionic 应用程序，并且在获取手机的链接以在 safari 中工作时遇到问题，我所做的解决问题的方法是创建一个小型实用程序函数（打字稿）以这种方式清除任何字符的电话号码：

cleanPhoneNumber(text: string): string 

    const cleanText = text.trim()
        // INITIAL CHAR
        .replace(/\+/g, '')
        // COMMON SEPARATORS
        .replace(/\-/g, ' ').replace(/\./g, ' ')
        // RARE CHARACTERS
        .replace(/\_/g, '').replace(/\,/g, '').replace(/\:/g, '').replace(/\;/g, '').replace(/\~/g, '');

    return cleanText;

“+”或“-”等字符会导致 safari 无法正确处理 href:tel（尽管 Chrome 或 Firefox 可以正常工作）

希望这可以帮助像我这样为 ios 构建应用程序的新手

【讨论】：

【参考方案3】：

以下内容对我有用，希望对您有所帮助。

<a href="javascript:void(0)" onclick="window.location='tel:8005555555'" class="call">800 555 5555</a>

它应该适用于 ios chrome 和 safari。

【讨论】：

【参考方案4】：

您可能想在超链接标签中添加target="_blank"。

它对我有用。

通过link了解更多关于target="_blank"的信息

【讨论】：

【参考方案5】：

如果您的电话号码在 safari 上没有显示仍然有问题，我遇到了完全相同的问题，我发现如果您不使用网络友好字体，它将不会显示尝试更改号码的字体到 Verdana 或 Arial。我使用了应该是网络友好的谷歌网络字体，但即使这样也破坏了我的号码。

希望这行得通。

【讨论】：

【参考方案6】：

您的标记很好，它适用于我的 iPhone（3GS，运行 4.3.5）。它在 iOS 模拟器上不起作用（是的，有“无法打开页面 - Safari 无法打开页面，因为地址无效”错误），但我不希望它，因为你不能让调用它（那个或旧版本的 iOS 有问题）。

【讨论】：

这种情况在 2018 年仍在发生…… ...2020 年仍在发生 您需要提供完整的电话号码，包括国家/地区前缀。然后在 Safari 中，至少版本 14 可以正常工作。【参考方案7】：

要在 Safari/iOS 中使用电话号码，您需要像在旧广告中一样正确格式化电话号码。

<a href="tel:1-555-123-4567" class="call">
----- OR -----
<a href="tel:15551234567" class="call">

【讨论】：

不，仍然得到同样的错误。我还从您的答案 chown 添加了元 taag 无济于事。我还尝试了设置为 tel:171 的链接，这是爱尔兰的标准语音信箱号码。 我很欣赏此选项提供的灵活性，更不用说与 iOS 上的 Chrome 的兼容性了。 （经过验证适用于 iOS 10.2.1 上的 Chrome 和 Safari）这个答案似乎经受住了时间的兼容性测试。【参考方案8】：

在您的&lt;head&gt; 中输入：

<meta name="format-detection" content="telephone=yes">

来自Safari html Reference：

这启用或禁用可能的自动检测 iOS 上 Safari 中网页中的电话号码。语法讨论 默认情况下，iOS 上的 Safari 会检测任何格式化为手机的字符串 号码并使其成为呼叫该号码的链接。指定 phone=no 禁用此功能。可用性 在 iOS 1.0 中可用 然后。支持级别 Apple 扩展。

【讨论】：

我只是想补充一下，在 Safari 完成这个技巧之后，电话号码“1-555-555-5555”变成了&lt;a href="tel:1-555-555-5555"&gt;1-555-555-5555&lt;/a&gt; 优雅的流线型方法，但不幸的是不适用于 iOS 版 Chrome。

以上是关于href=tel:555 链接在移动 Safari 中不起作用的主要内容，如果未能解决你的问题，请参考以下文章

android Intent

href 标记无法在新的 web 视图或移动 Safari 中打开

AdWords 分别跟踪多次点击转化

强制 iOS 应用在 Safari 中打开外部链接

强制链接从带有 javascript 的 Web 应用程序在移动 Safari 中打开

iOS 9 Web 应用程序阻止在移动 Safari 中打开链接