Phone number format recognition

Internet Explorer 11 automatically turns phone numbers into clickable links. This feature works when you have an app that can handle phone numbers, such as Skype.

Here's the developer's perspective phone number detection, including the HTML elements that enable this feature by default and how to turn the feature off when necessary.

Understanding phone number detection

When Internet Explorer in the new Windows UI encounters a telephone number as part of content rendered using a supported HTML element, it turns the number into a clickable link (and does so without modifying the DOM). When the user clicks the link, the app registered to the "tel" URI protocol is invoked.

Note  Phone number format recognition is not supported for Internet Explorer for the desktop, for applications hosting the WebBrowser control, or for IE11 for Windows 7.

 

Phone number detection comes into play for the following content patterns:

<element>425-882-8080</element>

425.<element>882</element>.8080

(425) 882-8080

For more examples and details, see How phone number detection works.

Phone numbers are also recognized across entities that span inline elements. This means the display property must be set to "inline".

In the patterns shown earlier, "<element>" refers to one of the following HTML elements:

abbr address article aside bdi bdo blockquote body caption cite code menuitem data dd del details dfn dialog div dl dt em embed fieldset figcaption figure footer h1, h2, h3, h4, h5, h6 header hr iframe ins kbd keygen label legend li link main map mark menu meter nav object ol output p q rp rt ruby s samp section small span strong sub summary sup table tbody td tfoot th thead time tr ul var wbr

 

Certain exceptions apply, however. Phone number format recognition is disabled when the contentEditable attribute set to "true". It can be also disabled though group policy or user preferences.

Controlling phone number detection

There are a few different ways to control   phone number format recognition:

  • To enable the behavior for an element (and its child elements), set the x-ms-format-detection attribute to "phone" or "all".

  • To disable the behavior for an element (and its child elements), set the x-ms-format-detection attribute to "none".

  • To disable the behavior for a webpage, use the meta element:

    <meta name="format-detection" content="telephone=no"/>
    
  • To selectively control the behavior using JavaScript, use setAttribute to change the value of the x-ms-format-detection attribute of the associate element or its parent. (Note that this needs to be done before the element or the parent is rendered in the DOM; dynamic changes are not supported.)

Remember, there is no guarantee that phone number detection will be enabled for IE11. Users can turn the feature off using preferences and administrators can disable the feature using group policies. Plan accordingly.