jquery - JQuery：如何从不区分大小写的下拉列表中选择一个值？

Question

我的场景：

• 我有一个用户输入文本的文本框
• 文本框有一个 onblur 函数，它尝试根据文本框输入从下拉列表（如果存在）中选择一个值

如果文本框值与下拉列表值相同，则此方法非常有效。但我希望它不区分大小写。

因此，如果用户键入“stackoverflow”，那么我希望它从下拉列表“StackOverflow”中进行选择。我怎样才能通过 jQuery 做到这一点？

Answer 1

这是另一种方法：在实际案例“StackOverflow”中找到匹配的值，然后调用val()它。

  var matchingValue = $('#select option').filter(function () { 
      return this.value.toLowerCase() === 'stackoverflow'; 
  } ).attr('value');    
  $('#select').val(matchingValue);

当然，字面'stackoverflow'量应该换成变量。

Answer 2

我认为做到这一点的最好方法是从之前而不是之后来看待它。如果将它们全部设为小写，则它们都是标准化的并且更易于使用。那么你所要做的就是将用户的输入全部小写，这样匹配东西真的很容易。

另一种选择是使用过滤器功能，就像在这里找到的那​​样：

$('something').filter(function() {
        return (new RegExp(value, "i")).test($(this).attr('attribute'));
    });

但是需要替换值和属性。

Answer 3

在模糊时，迭代您的选项并检查它是否匹配。然后选择匹配的那个。

在代码中：

$("#button").blur(function(){
  var val = $(this).val();
  $("#list option").each(function(){
     if($(this).text().toLowerCase() == val) $(this).attr("selected","selected");
  });
});

我还没有测试它，所以一定要检查语法错误。

Answer 4

正则表达式（RegExp）函数可能是要走的路。

var txt = new RegExp(pattern,attributes);

模式：文本模式
属性：“i”表示不区分大小写

您可以结合过滤功能。像这样的东西应该工作。

$("#textbox").blur( function () { 

    var text = $(this).val();

    var dropdownlist = 
       $("select").filter( function () {
          return (new RegExp(text, "i")).test($(this).attr("id"));
       });

    // do something to dropdownlist

});