Question

我试图在字符串中查找特定文本，如果发现将其包装在链接中。

我要查找的文字格式为：

号码|信| 4个随机数

示例： 7Q3847

使用jQuery，我可以找到一个示例（其中随机数是硬编码的）并成功将其转换为链接。到目前为止，这是我的代码：

$('.text').each(function(){
    var code = '7Q2992';
    code = code.replace(/\W/g, '');
    var str = code.split(" ");
    var link = $(this).text();
    text = link.replace(str, "<a href='https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=" + code + "'>" + str + "</a>");
    $(this).html(text);
});

我想要的是让var code能够搜索以7Q或7T开头的任何文字......

我很感激任何帮助！

FULL SNIPPET

＆＃13;

$('.text').each(function() {
  var code = '7Q2992';
  code = code.replace(/\W/g, '');
  var str = code.split(" ");
  var link = $(this).text();
  text = link.replace(str, "<a href='https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=" + code + "'>" + str + "</a>");
  $(this).html(text);
});

＆＃13;

body {
  width: 580px;
  margin: 50px auto 0;
  font-family: sans-serif;
  font-size: 16px;
}
.output {
  float: left;
}
.ideal {
  float: right;
}
header {
  color: white;
  padding: 10px;
}
.red {
  background: red;
}
.green {
  background: green;
}
p {
  line-height: 1.5;
}
a {
  text-decoration: none;
  color: blue;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="output">
  <header class="red">Current output</header>
  <p class="text">
    Text containing letters 7Q2992
  </p>
  <p class="text">
    Text containing letters 7T3940
  </p>
  <p class="text">
    Text containing letters 7Q3940
  </p>
</div>
<div class="ideal">
  <header class="green">Desired output</header>
  <p>
    Text containing letters
    <a href="https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=7Q2992">7Q2992</a> 
  </p>
  <p>
    Text containing letters <a href="https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=7T3940">7T3940</a>
  </p>
  <p>
    Text containing letters <a href="https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=7Q3940">7Q3940</a>
  </p>
</div>

＆＃13;

Answer 1

您可以使用$1将匹配的元素放回文本。

所以替换为/(\d\w\d{4})/到<a href="$1">$1</a>

＆＃13;

$(document).ready(function() {
  $('.output .text, .ideal p').each(function() {
    var text = $(this).text().replace(/(\d\w\d{4})/i, '<a href="http://google.com/$1">#$1</a>');

    $(this).html(text);
  })
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="output">
  <header class="red">Current output</header>
  <p class="text">
    Text containing letters 7Q2992
  </p>
  <p class="text">
    Text containing letters 7T3940
  </p>
  <p class="text">
    Text containing letters 7Q3940
  </p>
</div>
<div class="ideal">
  <header class="green">Desired output</header>
  <p>
    Text containing letters 7Q2992
  </p>
  <p>
    Text containing letters 7T3940
  </p>
  <p>
    Text containing letters 7Q3940
  </p>
</div>

＆＃13;

Answer 2

而不是手动使用值使用正则表达式字符串：

\d{1}[a-zA-Z]{1}\d{4}\g

此正则表达式将字符串与1位数字，1个字母字符，4位数匹配。

Answer 3

您可以尝试按照正则表达式执行此操作

var text = "hello test 7Q2992";
text = text.replace(/(7Q.*)\b/g, "<a href='https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=$1'>$1</a>");
console.log(text)

以上正则表达式将找到以7Q开头的任何字符串，并将其包装到锚标记中。如果你想让这个表达式更具体，请告诉我..它应该在7Q之后检查4位数。我们也可以添加

如果您想为4个数字添加约束...请尝试按照

var text = "hello test 7Q2992";
text = text.replace(/(7Q[0-9]{4})\b/g, "<a href='https://www.google.ie/?gws_rd=cr&ei=4j6LWLm4DcbYU6-KvZgB#safe=active&q=$1'>$1</a>");
console.log(text)

如何将特定文本转换为超链接？

3 个答案: