電話番号リンクの有効・無効

レスポンシブで制作した場合などにPC上では電話番号リンクは無効にしたい場合

パソコンではリンクのスタイルシートや下線表示もなくしたい場合

—–以下引用—–

jQuery：電話番号リンクの有効・無効をUAで切り替える方法
http://www.nxworld.net/tips/jquery-tel-link-ua-switching.html

<!– 【TW】↓20140208 –>

<script type=”text/javascript”>
$(document).ready(function() {
var ua = navigator.userAgent;
if(ua.indexOf(‘iPhone’) > 0 || ua.indexOf(‘Android’) > 0) {
$(‘.tel’).each(function() {
var txt = $(this).text();
$(this).parent().html($(‘<a>’).attr(‘href’, ‘tel:’ + txt.replace(/-/g, ”)).append(txt + ‘</a>’));
});
}
});
</script>

<!– 【TW】↑20140208 –>

—–以上引用—–

スマホの場合だけ、下記の記述からspan要素がa要素に変更される

<p><span class=”tel”>03-1234-5678</span></p>

↓

<p><a href=”tel:0312345678″>03-1234-5678</a></p>