wap頁面中手機號碼處理總結

標籤：

1、防止在iOS裝置中的Safari將數字識別為電話號碼

在測試中發現iPad上的Safari總會把長串數字識別為電話號碼，文字變成藍色，點擊還會快顯功能表添加到通訊錄。

別的地方倒也罷了，如果在使用者名稱中出現數字（手機註冊新浪微博的話使用者名稱就是“手機使用者xxxxxxxx”），版式會很噁心。

經過測試在a標籤中的長串數字不會識別為電話，於是給出現使用者名稱但沒有連結的地方嵌套一個無動作的a標籤，臨時解決了這個問題。

但是這樣增加了額外的標籤，代碼的語義性變得很差，而且對大段文字不能用這個方法。

今天無意中撞進Safari的官網，發現了safari有個私人meta屬性可以解決這個問題：

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

官網的說明如下： How do I disable automatic detection of phone numbers in webpages? In Safari on iPhone, phone numbers are automatically detected and transformed into links that dial the phone number when tapped. If you have strings of numbers in your webpage that should not be automatically detected as phone numbers, you can choose to disable this feature on the entire page by adding the meta tag shown in Listing 12.

2、點擊撥打

<a href="tel:電話號碼">電話號碼</a>

3、自訂被識別的手機號碼

被識別後也就是自動加了超連結，通過子級選取器定義a標籤即可

<div class="content">手機：1300000000</div>

.content a{color:#000;}

wap頁面中手機號碼處理總結