Question

我想要突出显示包含在文本框中编写的字符串的元素。这是应该执行的代码的一部分：

$("#rightContainer .magnifier").click(function () {
    var a = $("#searchBox").val();
    if (a != "") {
        var foundin = $('div:contains(a)');
        foundin.addClass("highlighted");    
        alert(a);
    }
})

问题是整个页面都会突出显示。我假设发生这种情况是因为我有一个主容器，它有子容器，所以contains方法选择整个主容器。是这种情况还是因为其他原因，有没有人有更好的方法呢？提前谢谢。

Answer 1

:contains选择器将返回包含您要搜索的文本的任何元素，在本例中为"a"。这与名为a的变量无关。也许你打算做这样的事情：

$("#rightContainer .magnifier").click(function () {
    var a = $("#searchBox").val();
    if (a != "")
    {
        var foundin = $("div:contains('" + a + "')");
        foundin.addClass("highlighted");    
        alert(a);
    }
})

Answer 2

如果我理解正确，你只需要突出显示包含搜索框而不是任何其他div的div。使用closest()查找div。

$("#rightContainer .magnifier").click(function () {
    var a = $("#searchBox").val();
    if (a != "")
    {
        $("#searchBox").closest('div').addClass('highlighted');
    }
})

使用contains方法和突出显示元素的问题

2 个答案: