如何在按键事件后突出显示文本？

Question

我试图在我的搜索表单中突出显示#字符后面的所有文本。

我想达到这样的效果，即文本被突出显示，直到空格键被按下。

// Detects hashtag keypress and highlights word
$('#nav-search').on('keydown',function(e){

  // console.log(e.which)
  // 163 == '#'

  if(e.which==163){
    console.log('# Pressed')
  }

});

我使用keydown事件检测#符号作为输入。

下面使用粗体作为高亮显示了一个示例效果。

例如：“这是一个#test #search查询”

Answer 1

为此，您应该使用replace。将其添加到keydown处理程序中：

$(this).val($(this).val().replace(/(?!<strong>)(#.*?)\s/g, "<strong>$1</strong>"));

regex匹配并捕获一个hashtag (或octothorp)以及后面的所有非空格字符，然后将它们封装在<strong>标记中。