Question

我有一个包含以下行的表：

苹果
篮
桃
球
盐水
围裙
车
煮
梨
李子
扼流圈

我创建了一个计时器解决方案，用户可以开始输入部分单词，我希望能够突出显示该行数据。

我可以通过以下方式获得一些信息：

console.log($('#' + ListBoxVal + ' tr:contains("' + filterString + '")'));

但是，当我输入字母“c”时，我得到以下结果：

桃
车
扼流圈
煮

我真正想要的是在以'c'开头的单词的第一个实例上更改css。

我查看了选择器（即〜=），但这似乎不起作用。从列表中的第一个字母完成过滤器匹配的最佳方法是什么？

更新

所有的建议都非常接近，但我的例子有点过时了。我更新了上面的列表以更准确。在上面的列表中，如果我的过滤器是字母“c”，那么下面的所有解决方案仍会带回“桃子”。

抱歉错误。

更新＃2

ShankarSangoli解决方案是在正确的道路上，但我仍然遇到问题，例如，如果我输入字符'ce'我正在匹配：

缺席而不是证书

确保我搜索单词的开头而不是整个单词的最佳方法是什么？

Answer 1

要匹配以子字符串开头的文本，您需要实现一个新的选择器：

$.expr[':'].startsWith = function(obj, index, meta, stack){
  return ($(obj).text().indexOf(meta[3]) == 0);
};

您还需要附加first selector：

$('#' + ListBoxVal + ' tr:startsWith("' + filterString + '"):first');

Answer 2

试试这个：

   //To select only the rows that start with filterstring
   var filteredList =  $('#' + ListBoxVal + ' tr:contains("' + filterString + '")').filter(function(i){

       return $(this).text().indexOf(filterString) == 0;

    })

  //To set the css for first element in the filteredList
  filteredList.eq(0).css({ fontWeight: "bold" });

Answer 3

我使用Padosley的正则表达式选择器：http://james.padolsey.com/javascript/regex-selector-for-jquery/或匹配选择器插件。

用^开始你的正则表达式，这意味着它必须从那开始。

Answer 4

$(...anything...).eq(0)会给你第一个结果。

jquery包含：获取第一个实例

4 个答案: