使用Javascript的Safari中的正则表达式电话号码

Question

我正在使用jquery / javascript将电话号码链接添加到具有电话号码的表中。电话号码在HTML中的格式为222-222-1234。我无权修改源代码。

HTML代码：

    <td>222-222-1234<td>

使用我的代码，我试图得到这个：

    <td><a href="tel:[phone]">222-222-1234</a><td>

这是我的代码：

var regex = /\(?([0-9]{3})\)?([ .-]?)([0-9]{3})\2([0-9]{4})/;
$('#Listing table tr td:nth-child(3), #ListingTable tr td:nth-child(3)').each(function() {
    var text = $(this).html();
    text = text.trim();
    text = text.replace(regex, '<a href=\"tel:$&\">$&</a>');
    $(this).html(text);
});

这似乎可以在Chrome / Firefox / IE中使用，但是在Ipad上的Safari中，电话号码显示为222-222-1234“>，最后带有”>。我不知道这是否是Ios上Safari上的问题，因为我没有Mac。

如何在Safari末尾摆脱“>？

Answer 1

您不需要正则表达式。您可以使用html()方法。提供一个接受当前HTML字符串作为参数的函数。这将包含当前电话号码值，您可以将其包装在<a>元素中并返回设置为新值。试试这个：

$('#Listing table tr td:nth-child(3)').html((i, h) => `<a href="tel:${h}">${h}</a>`);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="Listing">
  <table>
    <tr>
      <td>Lorem</td>
      <td>Ipsum</td>
      <td>222-222-1234</td>
    </tr>
    <tr>
      <td>Foo</td>
      <td>Bar</td>
      <td>222-987-6543</td>
    </tr>
  </table>
</div>