0

<SPAN>我在网上找到了这个出色的代码,用于通过使用标签和用户定义的类包装来突出显示文本中的单词。我多次使用它来一次突出显示多个搜索而没有任何问题。

我想要做的是向此代码添加一个额外的功能,以向使用 JQuery 的 .data() 方法添加的每个标签添加更多数据。但是函数是如此的整洁和高效我找不到我需要注入它的地方!

我想要一个像highlightJQueryText(elem, str, className, dataName, data)

highlightJQueryText: function (elem, str, className) {
            var regex = new RegExp(str, "gi");
            return elem.each(function () {
            $(this).contents().filter(function() {
                    return this.nodeType == 3 && regex.test(this.nodeValue);
                }).replaceWith(function() {
                        return (this.nodeValue || "").replace(regex, function(match) {
                        return "<span class=\"" + className + "\">" + match + "</span>";
                    });
                });
            });
        }

PS。它应该span.data("dataName", data)只将 a 添加到同时创建的那些标签中。(不是容器中具有“className”类的所有内容。)因为我使用相同的“ClassName”为不同的短语在同一个容器上多次运行该函数,但仍然希望在每个短语上存储一组不同的数据。

4

1 回答 1

0

像这样的东西应该可以解决问题:

highlightJQueryText: function (elem, str, className, dataName, data) {
    var regex = new RegExp(str, "gi");
    return elem.each(function () {
        $(this).contents().filter(function() {
            return this.nodeType == 3 && regex.test(this.nodeValue);
        }).replaceWith(function() {
            return (this.nodeValue || "").replace(regex, function(match) {
                return "<span data-"+dataName+"=\""+data+"\" \
                              class=\""+className+"\">"+match+"</span>";
            });
        });
    });
}

或者如果你真的想使用 JQuerydata方法:

highlightJQueryText: function (elem, str, className, dataName, data) {
    var regex = new RegExp(str, "gi");
    return elem.each(function () {
    $(this).contents().filter(function() {
            return this.nodeType == 3 && regex.test(this.nodeValue);
        }).replaceWith(function() {
            return (this.nodeValue || "").replace(regex, function(match) {
                return $("<span class=\""+className+"\">"+match+"</span>")
                    .data(dataName, data);
            });
        });
    });
}
于 2012-10-13T21:19:07.340 回答