在JavaScript / JQuery中实现实时搜索的高亮功能 [英] Implementing a highlight feature for a live search in JavaScript/JQuery

问题描述

我试图为livesearch实现突出显示功能。

我要做的是，发送一个带有用户查找的令牌的ajax请求。我收到一个包含表格的html文本。

所以我认为我可以使用一个简单的正则表达式，寻找用户令牌，然后用span来包围它，但是我接收一些longfilled < a> - 标签，所以用户输入内容的机会很大，并且我通过替换标签内的内容来破坏我的HTML。

那么我怎样才能在我的搜索中排除html标签呢？

哦，我正在使用javascript regexp。

$ b $你需要加载 jquery-plugin.html> jQuery highlight 插件，然后你可以这样做：

  var words =keyword1，keyword2，keyword3; 
 var keywords = words.split（'，'）; 
 for（var i = 0; i< keywords.length; i ++）{
 $（selector）.highlight（$。trim（keywords [i]））; 
 
 $ / code> 

如果您想在整个页面中突出显示，请将选择器与'body'，否则使用所需元素的选择器。

I'm trying to implement a highlighting feature for a livesearch.

What I do is, send an ajax request with an token the user looks for. I receive an html text containing a table.

So I thought I could use a simple regex, looking for the users token and then surround it with a span, but I am receiving some longfilled <a> - Tags, so chances are good that the user types something and I break my HTML by replacing something inside a tag.

So how can I exclude html tags in my search?

Oh I'm using javascript regexp.

解决方案

You would need to load jQuery highlight plugin and then you can just do something like this:

var words = "keyword1,keyword2,keyword3";
var keywords = words.split(',');
for(var i = 0; i < keywords.length; i++) {
    $(selector).highlight($.trim(keywords[i]));
}

If you wanna do highlighting in the entire page, then replace selector with 'body', otherwise use selector for desired element.

这篇关于在JavaScript / JQuery中实现实时搜索的高亮功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！