このページに記載されている「CSS」「JavaScript」等は、あくまでも記述例となっております。ご利用するPCサイトによって変更しないといけない場合があります。
そのため、このまま使用しサイトに異常が出た場合は、サポートは対象外となりますので、予めご了承の上ご利用いただけますようお願いいたします。
iPhoneのSafariでは、電話番号を自動でリンクにしてくれますが、
自動リンクしないAndroidブラウザ対応で、電話番号にひとつひとつに
tel付きの電話番号のリンクを付けるのが大変……という時に
役立つJavaScriptをご紹介いたします。
下記、JSを「変換完了時に実行されるコード」に記入していただき、
電話番号を自動リンクさせたい要素の編集メニュー「HTML属性 > class」に
「tel」と記入してください。
[html]
//電話番号自動リンク
(function($) {
$(‘.tel’).each(function(i, el) {
if (!$(el).find(‘a’).length) {
el.innerHTML = el.innerHTML.replace(/d+-d+-d+/g, function(match) {
return ‘<a href="tel:’ + match.replace(/-/g, ”) + ‘">’ + match + ‘</a>’;
});
}
});
})(Zepto);
[/html]
JSを追加していただくと、下記のように電話番号がtel付きのリンクになります。
[html]
//JS追加前
<div>03-1234-5678</div>
//JS追加後
<div class="tel"><a href="tel:0312345678">03-1234-5678</a></div>
[/html]
※変換元のPCページのhtml構造により、動作しない場合がございます。
これからもshuttoを宜しくお願いいたします！
shutto小技 バックナンバー
【shutto小技】一括で画像のalt属性をテキストに置換えるJavaScript
/?p=1693
【shutto小技】複数の設定で共通のCSSを使用する方法
/?p=1674
【shutto小技】アコーディオンタップ時の背景色の指定方法
/?p=1631
