いつのまにかAndroidのchromeでリンクを貼っていない電話番号をタップすると電話系アプリが立ち上がるようになっていた

どうもみなさまお久しぶりです。
web制作にかかわってる人です。

本当は昨日blogの当番でしたが完全に忘れておりました。すみませぬ。あうあうあう。
某お方に公開処刑はご勘弁とメッセを投げて執筆しております。

と、反省はこのくらいにして、最近はちょろっとお茶を濁すような記事を書くことが多かったのですが、久々に「！？」となった事が起こったので、ここでお話ししておこうかなと。

iPhoneのsafariで「数字の羅列が勝手に電話番号とみなされリンクを貼ってくれちゃうよ問題」があることはご存知の方も多いでしょう。
私も対応したことがあります。
ついでに対応方法は

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

上記のメタタグを追加するだけ。ありがたくも簡単です。

この問題、Androidでは特に起こらない……はずでした。

実際問題私が以前対応したときはAndroidではこの問題は発生しなかったのです……が！が！！ですよ。月日がたつのは早いもの、万物は流転し、全てのものは進化し日進月歩……て何言ってんだ私は。

正確なソースを発見できなかったので断言できないのですが、chromeのアップデートによるものなのかAndroidの進化によるものなのか、はたまたスマホアプリ自体の進化によるものか、Androidのchromeでも同様の現象が発生したのです。
しかもリンク扱いにはならないんだぜ！pタグで括ってたら別にスタイルはそのまんま（aタグ用のスタイルは効かないぜ！）って、わかるかーい！！！と、まあ遠吠えはこのくらいにして、件のメタタグも効かず情報はなぜか出てこない。
ということで荒技を使い対応いたしました。

まず電話番号をspanで括ります（任意のクラスをつけるよ）
jsにてクリックイベントを指定。処理はreturn:falseだけ。

<span class="notel">電話番号だよー</span>

$('.notel').click(function(){
	return:false;
});

これでイベント発生に上書きをかけました。
aタグにすると余計なスタイルが効いてしまうので、spanがちょうどよかった感じなー

いつこんな仕様になったのかほんとに謎です。

どこかの同じような問題に直面した誰かの役に少しでも立てば御の字です。ほんと。

それでは、また次の記事でお会いしましょー！さよーならー