Preventing UIWebView to detect & style phone numbers in a web page

Problem: iOS7's UIWebView incorrectly detects and turned numbers into links

Our app shows webpage contents in UIWebViews and after we switched to XCode5/iOS7SDK, we started seeing some numbers in webpages turning into clickable links that pointed to invalid telephone numbers.

After looking inside the HTML body, I found that iOS7 UIWebView injected an tag around the number inside the

tag.

Mobile Safari
<div class="coordinate" style="left: 0.5px; position: absolute; top: 130px;">
0</div>
<div class="coordinate" style="left: 25px; position: absolute; top: 130px;">
5</div>

...

UIWebView

<div class="coordinate" style="left: 25.5px; position: absolute; top: 130px;">
<a href="tel:0510152025" x-apple-data-detectors-result="14" x-apple-data-detectors-type="telephone" x-apple-data-detectors="true">5</a></div>

...

It looks like iOS7 UIWebView tries to be smart about data format detection and saw that there were a series of numbers that it thought could be a telephone number.  However, in this case it's not.

Solution: Disable the data format detection

There are 2 ways to fix this.

1. If you own the web page and can modify the HTML, add this meta tag to disable telephone number detection.
   <meta name = "format-detection" content = "telephone=no">
   
2. If you don't have access to the web page, you can programmatically disable the detection from UIWebView instance.
   
   self.webView.dataDetectorTypes = UIDataDetectorTypeNone;

The UIDataDetectorTypeNone will not detect any telephone number, link, address, calendar event.  If you want UIWebView to try detect some of these, you may have to use bit-or UIDataDetectorTypes enum values defined in UIKit's UIDataDetectors.h.