用于将电话号码转换为tel:链接的JavaScript

时间:2012-01-26 16:44:32

标签: javascript jquery regex

我需要一些帮助我的JavaScript,它会将电话号码转换为tel:links?

我需要这些代码做的事情很少:1)只查找文本中的数字,找不到位于标记属性中的数字。 2)一旦找到数字,将其包装在tel:anchor中。 3)清除href属性的数字(删除任何不是数字的数字)。 4)希望工作得非常快:)

使用jQuery很好,但我不确定这是否是最好的方法。

因此,JavaScript将更改页面上的所有实例:

<div data-something-that-looks-like-phone-number="(111) 222-3333"></div> 
(000) 000-0000

对此:

<div data-something-that-looks-like-phone-number="(111) 222-3333"></div>
<a href="tel:0000000000"> (000) 000-0000</a>

您会注意到数据 - 看起来像电话号码属性没有改变。

我有一个似乎适用于搜索电话号码的正则表达式

[01]?[- .]?[\(\. ]?[2-9]\d{2}[\)\. ]?[- .]?\d{3}[- .]\d{4}

任何让我入门的代码都会非常感激。谢谢!

此外,之前有一个类似的问题,解决方案是&#34;不要担心,因为手机会自动执行此操作。&#34;该解决方案对我们不起作用,即使在不自动执行此操作的设备上,我们也需要tel链接。再次感谢...

3 个答案:

答案 0 :(得分:1)

如果您有数据属性,我不明白为什么需要正则表达式:

$("div[data-number]").each(function() {
    var $a = $("<a />").attr("href", "tel:" + $(this).data("number"));
    $a.html($(this).html());
    $(this).html($a);
});

Demo.

答案 1 :(得分:1)

我认为你正在寻找类似的东西。

var phoneRegEX = /([01]?[- .]?[\(\. ]?[2-9]\d{2}[\)\. ]?[- .]?\d{3}[- .]\d{4})/;

$("div[data-number]").html(function(i, text) {
   text = text.replace(phoneRegEX, "<a href='tel://$1'>$1</a>");
   return text;
});

然而你的正则表达式看起来有点受限

答案 2 :(得分:1)

很老但我今天遇到这个并且无法找到任何有效的解决方案所以我写了这个正则表达式并将其添加为书签按钮。它弄乱了页面(css / images),但允许你点击要拨打的号码。

javascript:document.body.innerHTML = document.body.innerHTML.replace(/((\d[\d\-.]*){9,})/g, '<a href="tel://$1">$1</a>');

它将匹配至少9个字符与数字,。或 -

我必须澄清一下,它只是想帮助你点击一个号码来拨打它不是一个完美的解决方案。

******更新******

好吧,不能睡觉所以我创造了更好的东西。现在您只需要点击它将转向tel链接的号码,然后像往常一样点击它。

javascript:document.addEventListener('click', function(e) { e = e || window.event; var target = e.target || e.srcElement; target.innerHTML = target.innerHTML.replace(/(([\d|\(][\d\-.\)\s]*){9,})/g, '<a _was_replaced="true" href="tel://$1">$1</a>'); if (!target.getAttribute("_was_replaced")) { e.preventDefault(); } }, true);