禁用iPad桌面網頁鏈接上的電話號碼檢測？

我正在開發一個Web應用程序，該應用程序將作爲全屏應用程序從iPad上的桌面圖標啓動。 Apple documentation on phone links建議使用此元標記：禁用iPad桌面網頁鏈接上的電話號碼檢測？

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

但是，這似乎並不奏效。有沒有其他的HTML/CSS/JavaScript機制來控制這種行爲？

隨機注入錨標籤導致了我很多的CSS錯誤。

解決方法

一分劈，我發現工作是注入特殊的空格字符，但轉化輸出我的所有數據的思想不愉快伴我。這些角色帶來了他們自己的問題。這樣做會因AJAX和JavaScript轉換而進一步複雜化。

再現

重現步驟：

打開的頁面在iPad上的Safari
使用添加到主屏幕書籤功能
啓動的主屏幕圖標

樣頁：

<!DOCTYPE html> 
<html> 
<head> 
<meta name="apple-mobile-web-app-capable" content="yes"> 
<meta name = "format-detection" content = "telephone=no"> 
<title>Telephone detect</title> 
</head> 
<body> 
expected: 
<a href="tel:1555555">1555555</a> 
<br /> 
bad: 1555555 
<br /> 
bad: &#x31;&#x35;&#x35;&#x35;&#x35;&#x35;&#x35; 
<br /> 
inconvenient: 1&#xFEFF;555555 
</body> 
</html>

注意

This question似乎有關，但缺乏細節，我不知道，如果行爲是在iPhone上是相同的。這是一個Web應用程序，沒有本地組件。 iPad版本3.2.2。

來源

2010-11-24 McDowell

注意：自從我發佈此問題以來，已經有好幾年了，我無法評論此問題是否存在於更新的軟件版本中，也無法驗證任何提議的解決方案。 – McDowell 2014-07-17 08:13:44

好吧，修復它..添加一個<a href link>和樣式它沒有文字修飾...我在asp.net中使用asp：超鏈接控件，它在3.2上工作，所以不知道爲什麼它停在4.2，但使用標準的鏈接工作。

來源

2010-12-04 21:42:21 larryl

我欣賞這種努力，這個解決方案可能適合一些，但它引入了其他需要克服的問題（比如將事情變成製表符;可訪問性問題 - 這些東西仍然需要在其他瀏覽器上工作）。 – McDowell 2010-12-05 14:06:53

meta標籤在asp.net中適用於我。我的猜測是，它不適用於OP，因爲HTML格式不正確。非IE瀏覽器，Mozilla瀏覽器存在格式錯誤的XML/Html問題。變化

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

到

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

來源

2011-07-21 15:14:24

標記是HTML 5，其中`/`對[元素]（http://dev.w3.org/html5/spec/Overview.html#void-elements）沒有影響，比如`meta`。我不再在這個領域工作，也沒有iPad測試，所以無法檢查[spec]的行爲（http://dev.w3.org/html5/spec/Overview.html#start-標籤）。 – McDowell 2011-07-21 17:42:24

將這個電話鏈路負載後

if (navigator.userAgent.match(/(iPhone|Android|BlackBerry)/)) { 
//this is the phone 

} else if (navigator.userAgent.match(/(iPod|iPad)/)) { 
    $('a[href^=tel]').click(function(e){ 
     e.preventDefault(); 
    }); 
} else { 
//this is the browser 

    $('a[href^=tel]').click(function(e){ 
     e.preventDefault(); 
    }); 
}

來源

2013-06-07 14:37:39

爲什麼第二個塊需要？它不是和else塊做同樣的事嗎？ – webXL 2013-09-17 18:06:18

的meta標籤將工作：

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

這是Safari瀏覽器沒有正確顯示您的更新頁面。對頁面進行其他文本更改並刷新，並且更改將顯示。如果您已經以這種方式查看，只需添加meta標籤即可顯示頁碼，並將該編號解釋爲電話號碼。

來源

2014-07-17 07:57:24

供參考：縮進代碼4格式化的空間。 – McDowell 2014-07-17 08:11:20

禁用iPad桌面網頁鏈接上的電話號碼檢測？

回答

相關問題