javascript - 更改 javascript 搜索功能

Question

我在 html 输入/搜索栏上有一个 Javascript 工作 block 。除了一个问题之外，这一切都很完美:

现在，它按精确匹配进行过滤。因此，它会搜索页面上的 div，如果任何一个 div 及其子表匹配，它就会从表中删除所有其他行，只留下匹配的行。但目前它与确切的字符串匹配。

这只是一个问题，因为我们的许多商品在数字之间都有连字符。因此，如果有人搜索 4378-65，它会过滤他们需要的内容，但如果他们输入 437865，它会隐藏所有内容，因为它在技术上没有找到匹配项。

希望这是一个简单的修复，但非常感谢任何帮助。

JS:

<script type = "text/javascript">
$(document).ready(function(){
$("#srch-term").keyup(function(){
//For entered search values
// Retrieve the input field text and reset the count to zero
var filter = $(this).val(), count = 0;
var search_regex = new RegExp(filter, "i")

// Loop through the main container as well as the table body and row that contains the match
$(".group-container").each(function(){
    //check if filter matches the group name or description
    var group_name = $(this).children('h3').text()
    var group_description = $(this).children('.uk-text-muted').text()

    if(group_name.search(search_regex)>=0 || group_description.search(search_regex)>=0){ // filter matches
        $(this).show() // show group
        $(this).find("tbody tr").show() // and all children
        return // skip tr filtering
    }

    var no_matches = true

    $(this).find("tbody tr").each(function(){

        // If the list item does not contain the text phrase fade it out
        if ($(this).text().replace('Available','').search(search_regex) < 0) 
{
            $(this).hide();

        // Show the list item if the phrase matches and increase the count by 1
        } else {
            $(this).show();
            count++;
            no_matches = false
        }
    });

    if(no_matches){ // if no tr matched the search either, hide whole group
        $(this).hide();
    }

    });
  });
});
</script>

Answer 1

假设连字符对您来说并不重要(鉴于您提供的信息，它们看起来并不重要)，基本上您所要做的就是在比较过程中删除连字符，因此它基本上忽略了它们的存在:

var filter = $(this).val().replace("-", "");
// ...
var group_name = $(this).children('h3').text().replace("-", "");

这对你有用吗？