替换文本但不替换HTML标签？

Question

替换文本但不替换HTML标签？

3

我正在使用JQuery中的Autocomplete进行文本匹配，通过重载_renderItem方法来检查用户搜索的文本在JSON对象中是否存在。如果找到它，我将用具有“user_highlight_match”类的span标记替换它。

我正在进行多词搜索，所以"John Smi"会突出显示John，然后是Smi，而搜索"John James Smi"会突出显示"John"和"Smi"。但问题是，如果已经有了class属性的span标签，它会开始匹配标签属性。如何解决这个问题？

编辑：以下是一些代码示例：

renderItem = function(ul, item) {
    li = $('<li>', id: item._id);

    if this.term and not item.dialog
        terms = this.term.split(' ');

        for term in terms
            re = new RegExp("("+term+")", 'i');

            match = re.exec(item.name);
            if match
                item.name = item.name.replace re, "<span class=\"user_highlight_match\">+match[0]+</span>";
)

首先一个术语可以匹配成功，但如果您在html标签中搜索内容，则每次循环后部分匹配都将被替换为标签。例如，假设找到了“las”这个词，它会变成这样：

<span c<span class="user_highlight_match">Last</span>s="user_highlight_match">Last</span>

- user719958

3

我不太明白你的问题，请发一些代码。 - Ben Lee

代码已添加！如果您需要更多，请告诉我。 - user719958

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- gilly3 · Accepted Answer

您需要搜索文本节点并用您想要的html替换它们。请参阅此问题：在HTML中查找单词。 编辑：这是我在那里的答案的jQuery版本。 http://jsfiddle.net/gilly3/auJkG/

function searchHTML(searchString, htmlString) {
    var expr = new RegExp(searchString, "gi");
    var container = $("<div>").html(htmlString);
    var elements = container.find("*").andSelf();
    var textNodes = elements.contents().not(elements);
    textNodes.each(function() {
        var matches = this.nodeValue.match(expr);
        if (matches) {
            var parts = this.nodeValue.split(expr);
            for (var n = 0; n < parts.length; n++) {
                if (n) {
                    $("<span>").text(matches[n - 1]).insertBefore(this);
                }
                if (parts[n]) {
                    $(document.createTextNode(parts[n])).insertBefore(this);
                }
            }
            $(this).remove();
        }
    });
    return container.html();
}