Question

我有一个搜索输入字段，其中包含一些连接的javascript，我在页面上用作过滤器。它基本上接受输入并在h3标签中搜索名称和描述，但随后也搜索一个表（特别是tbody - ＆gt; tr），如果一行没有包含匹配则隐藏它。

我遇到了表体/行内容的一个问题。每行都有一个数字，通常是6位数，在4之后带有连字符，但并不总是（1234-56,9876-54等）。

问题是：如果您使用连字符搜索数字，它会正确过滤并仅显示该数字，但如果您只输入没有连字符的6位数字，它会隐藏所有内容，因为它在技术上找不到匹配项它搜索确切的字符串。

我发现了一些这样做的方法，但它们只适用于过滤器变量，但我需要一些帮助，即使它只是一个小的解决方法。基本上，当在tbody / tr中查找匹配时，我需要忽略连字符。因此，无论我输入123456还是1234-56，它都只会显示匹配的1234-56行。我希望这是有道理的。

Javascript：

<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

如果使用连字符搜索数字，则会正确过滤和只显示该数字，但如果您只输入6位数字，则不显示连字符隐藏了所有内容，因为它在技术上找不到匹配项由于它搜索确切的字符串。

如果您只想进行基于数字的搜索，请删除网格文本中的非数字字符，然后使用

进行比较

.replace(/\D/g, "");

并制作

var group_name = $(this).children('h3').text().replace(/\D/g, "");
var group_description = $(this).children('.uk-text-muted').text().replace(/\D/g, "");

以后

if ($(this).text().replace(/\D/g,'').search(search_regex) < 0) {
        $(this).hide();
 }

JS Jquery从搜索/过滤器输入中删除连字符（仅限数字）

1 个答案: