文本输入值与 JQuery 的不区分大小写比较答案

【问题标题】：Non-case-sensitive comparison of text input value with JQuery文本输入值与 JQuery 的不区分大小写比较
【发布时间】：2013-05-02 20:19:21
【问题描述】：

我已经查看了与在 JQuery 中编写自定义选择器相关的答案（例如这个：Writing jQuery selector case-insensitive version），但我仍然不清楚自定义选择器是否是解决我的问题的最佳方法。

我想从文本框中获取输入并将其与已知术语列表进行比较。我希望比较不区分大小写。这是我想要做的：

 $('#query').change(function() {   
    if ($("#query").val() == "kittens") {
       $('#change').text("kittens")
    }
    else if ($("#query").val() == "puppies") {
       $('#change').text("puppies")
    }
    else {
       $('#change').text("neither kittens nor puppies")
    }
 });

这是一个 JSFiddle：http://jsfiddle.net/XcbMQ/

我希望“kittens”、“Kittens”和“KITTENS”都与 kitten 条件匹配。我不清楚自定义选择器是否是最好的方法，或者我是否可以使用 .is() 或类似方法。如果自定义选择器是最好的方法，我如何/在哪里将它集成到我的代码中？

更新：

感谢dystroy，这是一个带有工作代码的JSFiddle： http://jsfiddle.net/XcbMQ/2/

【问题讨论】：

标签： jquery if-statement selector

【解决方案1】：

你可以的

if ($("#query").val().toLowerCase() == "kittens") {

【讨论】：

或@David Hedlund 提到的toUpperCase()
感谢您演示了在我的代码中添加 .toLowerCase() 的位置，使其工作变得非常简单。

【解决方案2】：

这是一个使用switch 而不是多个 if 语句的版本。做同样的工作，但有点整洁......

$('#change').text("nothing entered yet")

$('#query').change(function() {   
    var text = $(this).val().toLowerCase();
    switch (text) {
        case "kittens":
            $('#change').text("kittens");
            break;
        case "puppies":
            $('#change').text("puppies");
            break;
        default:
            $('#change').text("neither kittens nor puppies");    
            break;
    }
});

这是一个更新的小提琴......

http://jsfiddle.net/XcbMQ/3/

【讨论】：