Question

我正在使用此代码在我的文本中查找主题标签并用链接替换它们。但是，我的文本段落也包括十六进制颜色。因此，每当我解析代码时，我的颜色跨度都会被链接取代。有没有办法如何防止这种情况。

hashtag_regexp = /#([a-zA-Z0-9]+)/g;

function linkHashtags(text) {
 return text.replace(
    hashtag_regexp,
    '<a  href="'+base_url+'home/getTagArticles/$1">#$1</a>'
 );
}

$(document).ready(function(){
 $('.article-text').each(function() {
    $(this).html(linkHashtags($(this).html()));
  });
});

Answer 1

您需要做的是确定有关不同的十六进制颜色的上下文，然后将其作为negative-lookahead添加到正则表达式。

假设它们用于内联CSS中的背景颜色，如下所示：

background-color: #a4d6FF

你的正则表达式可以修改如下：

hashtag_regexp = /(?!background-color: *)#([a-zA-Z0-9]+)/g;

（未经过测试;如果有效，请告诉我）

Answer 2

/((?!(#[a-fA-F0-9]{3})(\W|$)|(#[a-fA-F0-9]{6})(\W|$))#[a-zA-Z0-9]*)/g

这将查找所有字母数字标签并忽略任何3或6个字符的标签，当它们后面跟着非alpha数字字符或行结尾时是六进制的。它并不是最顺畅的，但我测试了它似乎有效。

#aaa  //no match
#ffffff  //no match
#ffffff.  //no match
#rat  //match
#HashtagHere  //match

编辑：我编辑了正则表达式，将行结尾视为颜色的结尾。

Answer 3

尝试

    var hashtag_regexp = /(#(?!\d+|\w+))/;
    var base_url = "/abc123/";

    function linkHashtags(_, text) {
     // note `$1` will return `#` as the remembered matched substring
     return text.replace(
        hashtag_regexp,
        '<a  href="'+base_url+'home/getTagArticles/$1">$1</a>'
     );
    }

    $(document).ready(function() {
     $('.article-text').each(function() {
        $(this).html(linkHashtags);
      });
    });

var hashtag_regexp = /(#(?!\d+|\w+))/;
var base_url = "/abc123/";

function linkHashtags(_, text) {
 return text.replace(
    hashtag_regexp,
    '<a  href="'+base_url+'home/getTagArticles/$1">$1</a>'
 );
}

$(document).ready(function(){
 $('.article-text').each(function() {
    $(this).html(linkHashtags);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span class="article-text">
# #000000
</span>
<span class="article-text">
# #000033
</span>
<span class="article-text">
# #0000aa
</span>
<span class="article-text">
# #0000a3
</span>

主题标签和颜色的正则表达式

3 个答案: