渲染后在页面上突出显示文本

时间:2008-12-09 21:52:16

标签: html ajax parsing ajaxcontroltoolkit

我有一个应用程序,允许用户在多个字段中搜索字符串,当他们查看详细记录时,他们希望突出显示所有出现的字符串。

详细信息表单由Labels和ListView组成,其中大部分都位于TabPanels内(来自AJAX Control Toolkit)。我想避免使用暴力来手动解析每个值,以在显示之前添加突出显示标记。

有没有办法加载我的表单,然后解析HTML?还有另一种解决方法吗?

1 个答案:

答案 0 :(得分:5)

JavaScript和JQuery怎么样? http://plugins.jquery.com/project/highlight

我刚试了一下这个插件就行了。您可以指定要突出显示的标签以及哪些字词。

<script language="javascript" type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery.highlight-2.pack.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready( function () {
    $('p').each(function() { $.highlight(this, 'LOREM'); });
});
</script>
<style type="text/css">
    .highlight { background-color: yellow }
</style>

..
..
..
    <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi gravida risus elementum tortor. Duis mattis, est et volutpat cursus, mi mi ornare tortor, sed fringilla nibh erat sed eros. In nec orci vel velit scelerisque ultrices. Nunc auctor elit. Proin orci ligula, luctus a, venenatis sit amet, laoreet a, mauris. Suspendisse sem nibh, interdum eu, vestibulum non, semper vel, mauris. In quis leo suscipit risus semper pretium. Cras interdum iaculis dui. Etiam vel ipsum eu sapien dapibus sagittis. Donec lobortis, lectus et placerat euismod, quam dui porttitor sem, sed fermentum eros quam ac ipsum. Ut eu augue. Nullam lacinia dictum neque. Nullam eros. Phasellus sem nisi, feugiat nec, consectetur vel, ullamcorper at, nisl. Aenean quam risus, ullamcorper a, ultricies ut, posuere ac, quam. Vestibulum sed lectus ac orci fermentum viverra. Sed aliquam. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
    </p>