在Windows 10边缘浏览器中驯服自动电话号码

29 css windows-10 microsoft-edge

即使系统上没有安装手机应用程序,Windows 10的边缘浏览器似乎也能检测到手机号码.

它将电话号码格式化为蓝色并带有下划线,即使它只是在某个地方的纯文本中(某些背景上很难看),而且它会检测到增值税号码,就好像它们是电话号码一样.

那么我们如何控制它作为网站管理员:

  • 它如何呈现检测到的东西(我想MSFT为这些东西发明了他们自己的CSS选择器?)

  • 我们如何关闭检测

最好只使用针对该浏览器的内容,而不是冒着为他人搞砸事情或将非标准内容添加到其他有效代码的风险.

编辑:

  • 根据IE11 for Windows手机的方式关闭检测的建议方法在我的所有测试中都不起作用.元标记失败,非标准的html属性确实起作用.

  • 我看过边缘的检查事物,在我看来,那些检测到的项目的计算CSS是人们期望在没有检测到的情况下看到的(即计算的CSS是正常颜色而没有下划线),建议几乎没有机会控制它的呈现方式.

编辑:

测试用例1:元标记(失败)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta charset="UTF-8" />
    <!-- test -->
    <meta name="format-detection" content="telephone=no" />
  </head>
  <body>
    <p>text VAT BE 0123.456.789 text </p>
    <p>text +32 11 222 333 text</p>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

测试用例2:非标准html属性(有效)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <p x-ms-format-detection="none">text VAT BE 0123.456.789 text </p>
    <p>text +32 11 222 333 text</p>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

jfr*_*rej 27

显然,Internet Explorer 11中引入了电话号码检测,但桌面上没有.

以下是控制它的方法,取自这篇MS文章:电话号码格式识别

  • 要禁用元素(及其子元素)的行为,请将该x-ms-format-detection属性设置为"none".
  • 要禁用网页的行为,请使用元元素:

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

  • 要启用元素(及其子元素)的行为,请将x-ms-format-detection属性设置为"phone"或"all".

  • 要使用JavaScript有选择地控制行为,请使用setAttribute更改x-ms-format-detection关联元素或其父元素的属性值.(请注意,这需要在元素或父元素在DOM中呈现之前完成;不支持动态更改.)

如果我正确理解了该文章,如果在浏览器级别禁用了手机检测,x-ms-format-detection则将忽略该属性(或元标记).


小智 5

使用x-ms-format-detection="none"为我工作.但是我必须将它添加到父元素.

例如,我的电话号码被包裹在一个span类中,所以我不得不将它添加到上面的父div.直接添加到span标记并没有为我解决问题.

希望有所帮助