如何禁用移动Safari中的电话号码链接?

iPhone上的Safari会自动创build显示在电话号码上的数字string的链接。 我正在写一个包含IP地址的网页,而Safari正在把它变成一个电话号码链接。 是否可以禁用整个页面或页面上的元素的这种行为?

根据iPhone的Safari网页内容指南,这似乎是正确的做法:

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

如果你禁用了这个function,但仍然需要电话连接,你仍然可以使用“tel”URIscheme。

以下是苹果开发者库的相关页面 。

我遇到了同样的问题。 我在UIWebView上find了一个属性,可以让你closures数据检测器。

 self.webView.dataDetectorTypes = UIDataDetectorTypeNone; 

为了禁用特定元素的手机parsing外观,这个CSS似乎有诀窍:

 .element { pointer-events: none; } .element > a { text-decoration:none; color:inherit; } 

第一个规则禁用点击,第二个照顾样式。

添加这个,我想这是你在找什么:

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

Webview的解决scheme!

对于PhoneGap-iPhone / PhoneGap-iOS应用程序,可以通过将以下内容添加到项目的应用程序委托来禁用电话号码检测:

 // ... - (void)webViewDidStartLoad:(UIWebView *)theWebView { // disable telephone detection, basically <meta name="format-detection" content="telephone=no" /> theWebView.dataDetectorTypes = UIDataDetectorTypeAll ^ UIDataDetectorTypePhoneNumber; return [ super webViewDidStartLoad:theWebView ]; } // ... 

来源: 在PhoneGap-iOS中禁用电话检测 。

我使用零宽度木工&zwj;

只要在电话号码的某个地方,它适用于我。 testingBrowserStack(和Litmus的电子邮件)。

想想我已经find了一个解决scheme:把数字放在一个<label>元素中。 没有尝试过任何其他标签,但是<div>在主屏幕上保持活动状态,即使使用telephone=no属性。

从之前的评论中可以看出,meta标签确实有效,但由于某种原因,至less在某些情况下,在iOS的后续版本中已经崩溃了。 我正在运行4.0.1。

要禁用部分页面上的电话号码检测,请将​​受影响的文本包裹在带有href =“#”的锚点标记中。 如果你这样做,移动Safari和UIWebView应该离开它。

 <a href="#"> 1234567 </a> 

我有同样的问题,但在iPad的networking应用程序。

不幸的是,

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

也不…

 &#48; = 0 &#57; = 9 

…工作。

但是,这里有三个丑陋的黑客:

  • 用字母“O”代替数字“0”
  • 用字母“l”代替数字“1”
  • 插入一个无意义的范围:例如, 555.5<span>5</span>5.5555

根据您使用的字体,前两个几乎不明显。 后者显然涉及多余的代码,但对用户是不可见的。

Kludgy肯定会入侵,如果你是从数据dynamic生成你的代码,或者你不能以这种方式污染你的数据,那么可能就不可行。

但是,足够在一个捏。

我有一个ABN(澳大利亚商业编号),iPad Safari坚持要变成电话号码链接。 没有任何build议帮助。 我的解决scheme是把数字之间的img标签。

 ABN 98<img class="PreventSafariFromTurningIntoLink" /> 009<img /> 675<img /> 709 

这个类只是为了loggingimg标签的用途。

适用于iPad 1(4.3.1)和iPad 2(4.3.3)。

我的经验和其他人提到的一样。 元标记…

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

…当网站在Mobile Safari(即使用chrome)中运行时工作,但在作为webapp运行时停止工作(即,保存到主屏幕并且在没有铬的情况下运行)。

我不太理想的解决scheme是将值插入input字段中…

 <input type="text" readonly="readonly" style="border:none;" value="3105551212"> 

这是不理想的,因为尽pipe边框被设置为无,iOS会在场上呈现一个多像素的灰色条。 但是,比把这个数字看作一个链接要好得多。

我自己testing了这个,发现它可行,虽然它当然不是一个优雅的解决scheme。 在电话号码中插入一个空的跨度将防止数据检测器将其变为链接。

 (604) 555<span></span> -4321 

<meta name = "format-detection" content = "telephone=no">不适用于电子邮件:如果您正在准备的HTML是用于电子邮件,则元标记将被忽略。

如果你的目标是电子邮件,这是另一个丑陋的,但工作的解决schemeya'll:

某些HTML要避免链接或自动格式化的示例:

 will cease operations <span class='ios-avoid-format'>on June 1, 2012</span><span></span>. 

而那些会使魔术发生的CSS:

 @media only screen and (device-width: 768px) and (orientation:portrait){ span.ios-date{display:none;} span.ios-date + span:after{content:"on June 1, 2012";} } 

缺点:您可能需要为每个ipad / iphone纵向/横向组合的媒体查询

您还可以将javascript: void(0)<a>标签用作href值。

示例如下:
<a href="javascript: void(0)">+44 456 77 89 87</a>

你可以尝试将它们编码为HTML实体:

 &#48; = 0 &#57; = 9 

在应用程序的index.html中使用元标记( <meta name="format-detection" content="telephone=no"> )解决Sencha Touch应用程序中的同样问题。

这个答案胜过了2012年6月13日的一切:

 <a href="#" style="color: #666666; text-decoration: none; pointer-events: none;"> Boca Raton, FL 33487 </a> 

将颜色更改为任何与您的文本相匹配的文本,文本修饰删除下划线,指针事件阻止它像浏览器中的链接一样被查看(指针不会更改为手形)

这是在iOS和浏览器上的HTML电子邮件的完美。

我使用的不仅仅是移动Safari的技巧是使用HTML转义代码和电话号码中的小标记。 这使浏览器更难以“识别”电话号码,即,

 Phone: 1-8&#48;&#48;<span>-</span>62&#48;<span>-</span>38&#48;3 

为什么你想要删除链接,这使得它非常友好的使用。

如果你只是想删除自动编辑,但保持链接工作只需将其添加到您的CSS …

 a[href^=tel] { color: inherit; text-decoration:inherit; } 

我也有这个问题:Safari和其他移动浏览器将VAT ID转换为电话号码。 所以我想要一个干净的方法来避免它在一个单一的元素,而不是整个页面(或网站)。
我分享了我发现的一个可能的解决scheme,这是不是最理想的,但它仍然是非常可行的:我把数字里面,我不想成为tel:链接, &#8288; 它是Word-Joiner隐形字符的 HTML实体。 我试图保留更多的语义(好,至less是一种),把这个字符放在某个意义上的地方,例如,我select按照其格式在不同的数字组之间加上一个增值税号,所以意大利增值税一写道: 0613605&#8288;048&#8288;8在0613605和0488中呈现,并且它不被转换成电话号码。

另一种select是用字符replace电话号码中的连字符 (U + 2011'Unicode Non-Breaking Hyphen')

我真的很困惑这一段时间,但终于搞清楚了。 我们更新了我们的网站,并有一些数字转换为链接,有些则不是。 原来,如果数字在<fieldset>中,则不会将其转换为链接。 对于大多数情况来说,显然不是正确的解决scheme,但在一些情况下,这是正确的。

将数字分解成不同的文本块

 301 <div style="display:inline-block">441</div> 3909 

另一个解决scheme是使用IP号码的图像