替换标签内容,并高亮显示

难点,正则表达式的书写

/**
 * 搜索功能 查阅文书---begin
 * @param e:元素时间
 * @param obj:当前搜索的输入框
 * @param elementHtml:显示内容元素
 */
function doc_search_kwd(e,obj,elementHtml) {
    if (e && e.keyCode == 13) { // enter 键
        doc_searchKwd($(obj),$(elementHtml));
    }
}
/**
 * 调用搜索方法
 * @param obj
 * @param elementHtml
 */
function doc_searchKwd(obj,elementHtml) {
    doc_clearSelection();//先清空一下上次高亮显示的内容;
    var searchText = $(obj).val();//获取你输入的关键字;
    doc_highlight(searchText,$(elementHtml));
    doc_scrollToFirstFind($(elementHtml));
}

/**
 * 高亮显示
 */
function doc_highlight(searchText,elementHtml) {
    var searchText2 = searchText;
    searchText = searchText.replace(/\\/g, "\\\\");
    searchText = searchText.replace(/\(/g, "\\(");
    searchText = searchText.replace(/\)/g, "\\)");
    searchText = searchText.replace(/\$/g, "\\$");
    searchText = searchText.replace(/\{/g, "\\{");
    searchText = searchText.replace(/\}/g, "\\}");
    searchText = searchText.replace(/\[/g, "\\[");
    searchText = searchText.replace(/\]/g, "\\]");
    searchText = searchText.replace(/\+/g, "\\+");
    searchText = searchText.replace(/\./g, "\\.");
    searchText = searchText.replace(/\?/g, "\\?");
    searchText = searchText.replace(/\*/g, "\\*");
    searchText = searchText.replace(/\^/g, "\\^");
    searchText = searchText.replace(/|/g, "\|");
    if (searchText != "") {
        var html =$(elementHtml).html();
        var regx = "(>[^<>]*)("+searchText+")([^<>]*<)"
        var regExp = new RegExp(regx,'g');//创建正则表达式,g表示全局的,如果不用g,则查找到第一个就不会继续向下查找了;
        var content;
        var content = html.match(regExp);
        if (content != null && content != undefined){
            for(var i=0; i<content.length; i++) {
                var content1 = content[i];
                var regExps = new RegExp(searchText2, 'g');
                var contentAg = content1;
                content1 = content1.replace(regExps, '<a class="highlight" style="background-color: yellow;" >'+searchText2+'</a>');
                html = html.replace(contentAg,content1);
            }
        }
        $(elementHtml).html(html);//更新文章;
        $(elementHtml).scrollTop(0);
    }
}

/**
 * 定位到第一个查找到的
 */
function doc_scrollToFirstFind(elementHtml) {
    var high = $(elementHtml).find(".highlight");
    if (high.length > 0) {
        $("#docDetialContain").scrollTop($(high[0]).offset().top - 230);
    }
}

/**
 * 先清空一下上次高亮显示的内容
 */
function doc_clearSelection() { //  alert("#");
    $(".highlight").each(function () {
        var xx = $(this).html();
        $(this).replaceWith(xx);
    });
}

猜你喜欢

转载自blog.csdn.net/qq_34898847/article/details/82630850