1

我使用这个 jquery 插件来搜索文本：“ http://code.google.com/p/jquery-highlight/downloads/list ”..

但是我无法将这段代码包装在 Angular js 中，我的意思是说“我无法编写指令来调用这个 jquery 插件”......！！！

更新 ：

谷歌群组中的相同帖子：

这是组

4

2 回答 2

2

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

您不需要 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-27T10:04:44.293 回答
0

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

于 2014-01-13T09:48:03.567 回答