Mobile Safariで電話番号リンクを無効にする方法は？

iPhoneのSafariは、電話番号に表示される数字列のリンクを自動的に作成します。IPアドレスを含むWebページを作成していますが、Safariはそれを電話番号リンクに変換しています。この動作をページ全体またはページ上の要素に対して無効にすることはできますか？

Safari HTMLリファレンスによると、これは正しいことのようです。

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

これを無効にしても電話リンクが必要な場合は、「tel」URIスキームを引き続き使用できます。

こちらはアップル社の開発者ライブラリの関連ページです。

特定の要素の電話解析の外観を無効にするために、このCSSはトリックを行うようです：

.element { pointer-events: none; }
.element > a { text-decoration:none; color:inherit; }

最初のルールはクリックを無効にし、2番目のルールはスタイリングを処理します。

ゼロ幅のジョイナーを使用しています ‍

それを電話番号のどこかに置くだけでうまくいきます。BrowserStack（および電子メールのLitmus）でテストされています。

私も同じ問題を抱えていました。UIWebViewで、データ検出器をオフにできるプロパティを見つけました。

self.webView.dataDetectorTypes = UIDataDetectorTypeNone;

これを追加してください、それがあなたが探しているものだと思います：

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

Webviewのソリューション！

PhoneGap-iPhone / PhoneGap-iOSアプリケーションの場合、プロジェクトのアプリケーションデリゲートに以下を追加することにより、電話番号の検出を無効にできます。

// ...

- (void)webViewDidStartLoad:(UIWebView *)theWebView 
{
    // disable telephone detection, basically <meta name="format-detection" content="telephone=no" />
    theWebView.dataDetectorTypes = UIDataDetectorTypeAll ^ UIDataDetectorTypePhoneNumber;

    return [ super webViewDidStartLoad:theWebView ];
}

// ...

ソース：PhoneGap-iOSで電話検出を無効にします。

ページの一部で電話番号の検出を無効にするには、影響を受けるテキストをhref = "＃"でアンカータグで囲みます。これを行うと、モバイルSafariとUIWebViewはそのままにします。

<a href="#"> 1234567 </a>

私が解決策を見つけたと思います：数値を<label>要素の中に入れます。他のタグは試していません<div>が、telephone=no属性があってもホーム画面でアクティブのままにしておきます。

以前のコメントからメタタグが機能したことは明らかのようですが、何らかの理由で、少なくともいくつかの条件下では、iOSの新しいバージョンでは機能しません。4.0.1を実行しています。

<a>ラベルを値javascript: void(0)として使用することもできhrefます。

次の例：
<a href="javascript: void(0)">+44 456 77 89 87</a>

私も同じ問題を抱えていましたが、iPad Webアプリ上でした。

残念ながら、どちらも...

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

また...

0 = 0
9 = 9

...働いた。

しかし、ここに3つの醜いハックがあります。

• 数字の「0」を文字「O」に置き換えます
• 数字の「1」を文字「l」に置き換える
• 意味のないスパンを挿入します。例： 555.5<span>5</span>5.5555

使用するフォントによっては、最初の2つはほとんど目立ちません。後者には明らかに余分なコードが含まれますが、ユーザーには見えません。

Kludgyは確かにハッキングします。データから動的にコードを生成している場合、またはこの方法でデータを汚染できない場合は、おそらく実行できません。

しかし、ピンチで十分です。

私は、iPad Safariが電話番号リンクに変えることを主張したABN（オーストラリアのビジネス番号）を持っていました。どの提案も役に立たなかった。私の解決策は、数字の間にimgタグを置くことでした。

ABN 98<img class="PreventSafariFromTurningIntoLink" /> 009<img /> 675<img /> 709

このクラスは、imgタグの目的を文書化するためにのみ存在します。

iPad 1（4.3.1）およびiPad 2（4.3.3）で動作します。

私の経験は他の人が述べたのと同じです。メタタグ...

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

... WebサイトがMobile Safariで（つまり、クロムを使用して）実行されている場合は機能しますが、Webアプリとして実行すると機能を停止します（つまり、ホーム画面に保存され、クロムなしで実行されます）。

私の理想的ではない解決策は、値を入力フィールドに挿入することです...

<input type="text" readonly="readonly" style="border:none;" value="3105551212">

境界線がなしに設定されているにもかかわらず、iOSはフィールドの上にマルチピクセルの灰色のバーをレンダリングするため、これは理想的とは言えません。しかし、それはリンクとして数を見るよりはましです。

私はこれを自分でテストしたところ、確かにエレガントな解決策ではありませんが、機能することがわかりました。電話番号に空のスパンを挿入すると、データ検出機能がそれをリンクに変換しなくなります。

(604) 555<span></span> -4321

<meta name = "format-detection" content = "telephone=no"> メールでは機能しません。準備しているHTMLがメール用である場合、メタタグは無視されます。

対象が電子メールの場合は、次の方法で問題を解決できますが、うまくいきません。

リンクまたは自動フォーマットを回避したいHTMLの例：

will cease operations <span class='ios-avoid-format'>on June 1,
2012</span><span></span>.

そして、魔法を起こすCSS：

@media only screen and (device-width: 768px) and (orientation:portrait){
span.ios-date{display:none;}
span.ios-date + span:after{content:"on June 1, 2012";}
}

欠点：iPad / iPhoneポートレート/ランドスケープの各コンボに対してメディアクエリが必要になる場合がある

それらをHTMLエンティティとしてエンコードしてみることができます。

0 = 0
9 = 9

Sencha Touchアプリと同じ問題が<meta name="format-detection" content="telephone=no">、アプリのindex.htmlのメタタグ（）で解決されました。

Mobile Safari以外にも機能する私が使用するトリックは、HTMLエスケープコードと電話番号の小さなマークアップを使用することです。これにより、ブラウザが電話番号を「特定」することがより困難になります。

Phone: 1-8&#48;&#48;<span>-</span>62&#48;<span>-</span>38&#48;3

私にもこの問題があります。Safariやその他のモバイルブラウザーはVAT IDを電話番号に変換します。したがって、ページ全体（またはサイト）ではなく、単一の要素でそれを回避するためのクリーンなメソッドが必要です。
私は見つけた可能な解決策を共有しています。それは最適ではありませんが、それでもかなり実行可能です。tel:リンクになりたくない番号の中に⁠、Word-Joinerの非表示文字であるHTMLエンティティを挿入します。VAT ID私はに応じて数字の異なるグループ間でそれを置くことを選んだために私は例えば、いくつかの意味の場所にこの文字を入れることで（の少なくとも一種、ウェル）よりセマンティックに滞在しようとしたその形式イタリア語VATのために私は0613605⁠048⁠8記述：0613605⁠048⁠8でレンダリングされ、電話番号に変換されません。

別のオプションは、電話番号のハイフンを文字に置き換えることです‑（U + 2011 'Unicode Non-Breaking Hyphen'）。

しばらくこれに戸惑いましたが、ようやくわかりました。私たちはサイトを更新し、リンクに変換する数値とそうでない数値がありました。<fieldset>内にある場合、数値はリンクに変換されないことがわかります。明らかに、ほとんどの状況に適したソリューションではありませんが、場合によってはそれが適切なソリューションになります。

この回答は、2012年6月13日の時点ですべてに優先します。

<a href="#" style="color: #666666; 
                   text-decoration: none;
                   pointer-events: none;">
  Boca Raton, FL 33487
</a>

色をテキストに一致するものに変更します。テキストの装飾により下線が削除され、ポインターイベントによりブラウザーのリンクのように表示されなくなります（ポインターは手に変わりません）。

これは、iOSおよびブラウザでのHTMLメールに最適です。

リンクを削除したいのはなぜですか。このオプションを使用すると、非常にユーザーフレンドリーになります。

自動編集を削除するだけで、リンクを機能させたい場合は、これをCSSに追加するだけです...

a[href^=tel] {
 color: inherit;
 text-decoration:inherit;
}

数値をテキストの個別のブロックに分割する

301 <div style="display:inline-block">441</div> 3909

別の解決策は、IP番号のイメージを使用することです。