Question

我正在尝试将一个搜索框放在一起，当它们被输入框中时，它会突出显示元素中的单词。到目前为止，它正在为单个单词工作，但当某个东西包含空格时，它只找到它的第一部分。

代码使用插件进行突出显示，但我认为问题更多的是data传递给插件以突出显示它。

我相信data[d]正在拆分单词，而它只找到数组中的第一个单词。

我的目标是能够搜索super cool（在小提琴中）并让它突出显示两个单词，因为它匹配。

$("#ruleSearch").keyup(function() {

  // Split the current value of searchInput
  var data = this.value.toLowerCase().split(" ");

  if (this.value == "") {
    $('.ruleDetailsPlaceholder').unhighlight();
    return;
  }

  for (var d = 0; d < data.length; ++d) {

      // Highlight our query within the rule
    $('.ruleDetailsPlaceholder').unhighlight();
    $('.ruleDetailsPlaceholder').highlight(data[d]);

    return true;

  }
  return false;
})

小提琴：https://jsfiddle.net/g60ps0xw/

Answer 1

您只需将this.value.toLowerCase()存储在data中，然后移除循环即可：

$('.ruleDetailsPlaceholder').unhighlight();
$('.ruleDetailsPlaceholder').highlight(data);

这里是jsfiddle。这是你在找什么？

Answer 2

这里有一个小提琴，它将突出＆＃34; super＆＃34; ＆＃34;很酷＆＃34;。

https://jsfiddle.net/g25othfy/

请在代码中注意：

   $('.ruleDetailsPlaceholder').unhighlight();

将为“数据”中的每个元素调用

。阵列。所以，正在发生的事情是数据[0]被突出显示，然后不突出显示，然后数据[1]被突出显示等。

Answer 3

@ComponentScan(basePackages = arrayOf("YourAppBasePackage"))
@SpringBootTest(classes = arrayOf(MyExampleApplication::class))

会发现＆＃34;超酷＆＃34;但不是＆＃34;超级东西＆＃34;

jQuery突出显示搜索词

3 个答案: