jquery 使用正则表达式搜索突出显示文本引发错误[duplicate]

fykwrbwg  于 2022-12-12  发布在  jQuery
关注(0)|答案(1)|浏览(186)

此问题在此处已有答案

Escape string for use in Javascript regex [duplicate](1个答案)
5天前关闭。
以下是产品列表和搜索筛选器的示例:
第一个
如果我输入“test”,它会正常工作,但当我尝试输入test Product (时,我会得到以下错误:

未捕获的语法错误:正则表达式无效:/测试产品(/:未终止的组(位于

我基本上是尝试过滤我们的结果并突出显示它们。我如何在过滤器中允许特殊字符?
谢谢

3ks5zfa0

3ks5zfa01#

您可以通过替换特殊字符来轻松实现:

jQuery( document ).ready( function( $ ) {
    $( '#discount-products-search' ).on( 'keyup blur', function() {
        let elSearch = $( this );
        let elSearchVal = elSearch.val().toLowerCase();
        
        $( '.discount-products-list .product-item' ).each( function() {
            let _el = $( this );
            let _elA = _el.find( 'a' );
            let _elAText = _elA.text();
            let _elATextLowercase = _elAText.toLowerCase();
            
            if( _elATextLowercase.indexOf( elSearchVal ) > -1 ) {
                _el.show();
                
                _elAText = _elAText.replace( new RegExp( elSearchVal.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'ig' ), ( match, $1 ) => {
                    return '<mark>' + match + '</mark>';
                } );
                
                _elA.html( _elAText );
            }
            else {
                _el.hide();
                
                _elA.html( _elAText );
            }
        } );
    } );
} );

相关问题