高光采用了棱角分明的js搜索文本，jQuery的和CSS

即时通讯使用这个jQuery插件搜索文本：“http://code.google.com/p/jquery-highlight/downloads/list” ..高光采用了棱角分明的js搜索文本，jQuery的和CSS

但是我不能够在角JS来包装这个代码，我的意思是说“我无法写一个指令来调用这个jquery插件”...... !!!

更新时间：

同一职位在谷歌组：

This is the group

来源

2012-07-27 praveenpds

你的问题非常含糊。更具体地说，提供一些示例代码 – 2012-07-27 10:00:22

UPDATE：这只是一个例子。您可以根据自己的需要进行修改。

您不需要RegExp比较。让我们简单使用javascript的split()函数

1）定义突出显示的样式。

.srchslctn{ 
    background-color: yellowgreen; 
    color: red; 
}

2）你的示例HTML

<body> 
    <div> 
     <div id="serach-Paragraph"> 
      Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 
     </div> 
     <input type="button" id="h" value="Highlight"/> 
     <div id="target"></div> 
    </div> 
</body>

3）的JavaScript

  $(document).ready(function(){ 
      $("#h").on('click',function(){ 
       highlight(); 
      }); 
     }); 

     function highlight(){ 
      $("#target").empty(); 
      var mainString = $("#serach-Paragraph").html(); 
      var searchString = "ipsum"; 
      var arr = mainString.split(searchString); 
      var len = arr.length; 
      var finalString=""; 
      for(var i=0;i<arr.length;i++){ 

       finalString+=arr[i]; 

       if(i<len-1){ 
        finalString+='<span class="srchslctn">'+searchString+'</span>'; 
       } 
      } 
      $("#target").html(finalString); 
     }

那它....

说明 - ：split()将根据您的searchString来打破targetString。这与我们如何检索逗号分隔值类似。只有在这种情况下，您的搜索字符串就像逗号:)

然后保持arr[0]原样。突出显示您的搜索字符串并将其附加到arr[0]。追加arr[1]以上结果等。

简单....

搜索的文本中，你必须只突出显示文本的匹配部分保持静止，因为它是什么？

来源

2012-07-27 10:04:44 AdityaParab

提供一些用例... – AdityaParab 2012-07-28 09:34:25

即时通讯使用此jquery插件搜索文本“http://code.google.com/p/jquery-highlight/downloads/list”..但im不是能够在角js中包装这个代码，我的意思是说：“我无法写一个指令来调用这个jquery插件” – praveenpds 2012-07-28 11:14:52

在Google组中同样的帖子：非常活跃的组“https://groups.google.com/论坛/＃！topicsearchin /角/角$ 20directive $ 20for $ 20jquery $ 20plugin /角/ rjsdnIhJRck” – praveenpds 2012-07-28 11:45:02

您可以使用Angular-UI Highlight过滤器。

来源

2014-01-13 09:48:03 alisabzevari

高光采用了棱角分明的js搜索文本，jQuery的和CSS

回答

相关问题