HTML输入搜索没有找到大写，反之亦然

Question

如果搜索UPPERCASE，如果使用小写uppercase搜索此代码，则lowercase找不到LOWERCASE，{{1}}相同。 我想在搜索之前使用jquery将输入和数据标签设置为小写，但是如何？

jsfiddle code here

有人可以帮忙，谢谢

Answer 1

这是一个更新的小提琴http://jsfiddle.net/jdmTZ/5/

删除数据属性并将其添加到代码中：

            $('.filter li').each(function() {
                $(this).attr('data-label', $(this).text().toLowerCase());
            });

然后按小写输入搜索

                var input = $(this).val().toLowerCase();

Answer 2

由此替换第14行：

var matched = $("ul li").filter(function() { return $(this).data('label').toLowerCase().indexOf(input.toLowerCase()) >= 0; });

并更改show() / hide()逻辑：

$('ul li').hide();
matched.show();
matched = matched.length;

Complete fiddle

这也消除了某人输入]或其他特殊字符的问题 - 这会破坏代码中的CSS规则。

Answer 3

使用toLowerCase()和$.each Updated js fiddle code