Question

问题

我需要找到href值以＆＃34; tel：＆＃34;开头的所有标签，我的意思是它应该是一个数字。一旦发现这种模式，我需要在标签的左侧放置img

我在常规快递方面做了什么

  <a\s+(?:[^>]*?\s+)?href=(["'])(tel:.*?)\1

但我不确定它是一个解决方案，我知道它的一半解决方案，但我不知道执行它。

预期产量：电话号码与img，所以用户可以看到它。

我在这里需要帮助。

Answer 1

在jQuery和CSS中都有一个<?xml version='1.0' encoding='UTF-8' ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> <h:head> <title>Facelet Title</title> </h:head> <h:body> The selected value is: #{myManagedBean.selectedMyEnum} </h:body> </html>选择器。此选择器为attribute和[。以下选择器将匹配任何锚点，其]属性以“tel：”开头：

href

选择器$('a[href^="tel:"]');的意思是“开始”。

在所有电话主播之前放置相同的图像：

^=

$('a[href^=tel:]').before('<img src="/path/to/image"/>');

jQuery(document).on('ready', function(){
  jQuery('a[href^="tel:"]').before('<img src="http://lorempixel.com/20/20/technics/"/>');
});

Answer 2

这是一个只有CSS的解决方案：

a[href^="tel:"] {
    padding-left: 30px;
    background: url(telephone.png) left center no-repeat;
}

假设图像的宽度为24px，我会给它30px的填充，以便在图标和电话之间留出一些空间。

一个工作示例：

＆＃13;

a[href^="tel:"] {
  padding-left: 150px;
  background: url('http://cdn3.iconfinder.com/data/icons/token/128/Telephone-Alt.png') left center no-repeat;
  height: 128px;
  display: block;
}

＆＃13;

<a href="tel:98176517892">98176517892</a>

＆＃13;

Answer 3

普通js解决方案：

document.querySelectorAll('[href^="tel:"]')

css解决方案：

a[href^="tel:"] {
    background-image: url(your_image_path)
}

Answer 4

@Richard Parnaby-King的回答看起来更好：）

在这里你可以用javascript做到这一点。您可以根据需要更改css。现在我唯一做的就是将标签与带有电话号码和其他标签的标签区分开来。

  var aTag = document.getElementsByTagName("a");
  for (var i = 0; i < aTag.length; i++) {
    var aTagContent =  aTag[i].href;
    var first = aTagContent.substr(0,   aTagContent.indexOf(':'));
    if (first == "tel") {
      $(aTag[i]).addClass( "myClass" );
    }
  }

.myClass {
  background: green;
  color: #fff;
  padding:5px;
  margin-bottom:10px;
  display: block;
]

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="tel: +905554545566">+905554545566</a></body><br>
<a href="tel: +905554545567">+905554545567</a><br>
<a href="tel: +905554545568">+905554545568</a><br>
<a href="#">No telephone</a>

如何使用jquery正则表达式在标记中查找电话号码

4 个答案: