JavaScript搜索功能也在搜索html代码

JavaScript search function is also searching html code

本文关键字：搜索 html 代码 功能 JavaScript      更新时间：2023-09-26

我想在答案部分使用html标签，但当我这样做的代码是通过使用搜索时。我对JavaScript没有什么经验，所以任何建议都会很有帮助

JavaScript 

$('h3.Topic').click(function () {
    $(this).next().toggle(300);
});
$('h4.Question').click(function () {
    $(this).next().toggle(300);
});
$('#ExpandAll').click(function () {
    $('#FAQ').children('div.TopicContents').show(300).children('div.Answer').show(300);
});
$('#CollapseAll').click(function () {
    $('#FAQ').children('div.TopicContents').hide(300).children('div.Answer').hide();
});
jQuery.expr[':'].Contains = function (a, i, m) {
    return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};
$('#SearchFAQ').click(function () {
    $('#FAQ').children('div.TopicContents').hide().children('div.Answer').hide();
    if ($('#FAQSearch').val() != '') {
        $('div.Answer:Contains(' + $('#FAQSearch').val().toUpperCase() + ')').show().parent().show(300);
        try {
            $('.highlight').removeClass("highlight");
            $('div.Answer:Contains(' + $('#FAQSearch').val().toUpperCase() + ')').each(function () {
                $(this).html(
                    $(this).html().replace(
                        new RegExp($('#FAQSearch').val(), "ig"),
                        function (match) {
                            return '<span class="highlight">' + match + '</span>';
                        }
                    )
                )
            });
        } catch (err) {}
    }
    return false;
});

尝试用new RegExp('(' + $('#FAQSearch').val() + ')(?![^<]*>)', "ig")代替new RegExp($('#FAQSearch').val(), "ig")

演示:http://jsfiddle.net/4PWRj/

var $searchArea = $('#search-area');
$('input').keyup(function () {
    var value = this.value.trim(), rx;
    $searchArea.find('.highlight').each(function () {
        this.parentNode.replaceChild(document.createTextNode(this.textContent), this);
    });
    if (!value) return;
    rx = new RegExp('(' + this.value + ')(?![^<]*>)', "ig");
    $searchArea.html($searchArea.html().replace(rx, '<span class="highlight">$1</span>'));
});
相关文章：