在搜索 javascript 中忽略大小写敏感

Question

我有这样的事情：

HTML

<input type="text" name="keyword" onkeyup="searchFunction()" style="width:300px;" />

JavaScript

    function searchFunction() {
    $(".contact-name") /*Contact-name is the name of the div*/
    .hide()
    .filter(":contains('" + $("input[name='keyword']").val() + "')")
    .show();
    }

所以它可以工作，但是当 div 包含类似 george 的文本并且我在搜索文本框中输入 GEORGE 时，它不起作用，所以你能帮帮我吗？

Answer 1

filter 接受一个函数，所以我可能会使用它并进行不区分大小写的比较：

function searchFunction() {
    var find = $("input[name='keyword']").val().toLowerCase();
    $(".contact-name") /*Contact-name is the name of the div*/
    .hide()
    .filter(function() {
        return $(this).text().toLowerCase().indexOf(find) != -1;
    })
    .show();
}

我也不想把它们全部隐藏起来然后显示匹配项，而是单独更新每个匹配项：

function searchFunction() {
    var find = $("input[name='keyword']").val().toLowerCase();
    $(".contact-name") /*Contact-name is the name of the div*/
    .each(function() {
        var $this = $(this);
        $this.toggle($this.text().toLowerCase().indexOf(find) != -1);
    });
}