jQuery指定内容关键词文字高亮显示代码

来源:https://www.sucaihuo.com/js/4410.html 2019-06-08 12:07浏览(508) 收藏

jQuery指定内容关键词文字高亮显示代码,输入关键词对指定段落内容查找高亮显示效果,支持多个关键词查找,用“|”隔开。注意:区分大小写字母。
jQuery指定内容关键词文字高亮显示代码
分类:文字特效 > jQuery插件 难易:初级
查看演示 下载资源 下载积分: 30 积分

js代码

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/highlight.js"></script>
<script type="text/javascript">
    /* 保存初始测试文本内容 */
    var oldStr=$("#testHtml").html();
    /* 测试按钮点击 */
    $("#replace").click(function () {
        var val=$("#replaceVal").val();
        if(!val){
            alert('请输入需要高亮的内容');
            return;
        }
        /* 插件调用,返回 添加高亮效果 的字符串 */
        var newStr=$.highlight(oldStr,{
            color:'#ea0000',// 高度颜色,默认:#f00
            weight:true,    // 是否加粗,默认:不加粗
            keys:val        //需要高亮的值,必须的
        });
        $("#testHtml").html(newStr);
    });
    /* 执行测试按钮点击事件 */
    $("#replace").click();
</script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2