jquery显示隐藏tr的选择选项

我的目标是通过选择来显示/隐藏tr

我有一个带有

id=“selcat”

的

，还有一个带有

id=“maplist”

的表。select控件的

是从MySQL记录集生成的，默认情况下显示all

（在源代码中，my val选项看起来是这样的）

现在，我想通过jQuery在不刷新页面的情况下对其进行过滤

我试过这个：

$('select#selcat').change(function() {
    $("#maplist tr").hide().filter($(this).val()).show();
}).change();
});

---

但是所有tr都被这段代码隐藏了，我想知道出了什么问题。

以下面的HTML为例：

<select id="selcat">
    <option value="[data-val='a']">A</option>
    <option value="[data-val='b']">B</option>
    <option value="[data-val='c']">C</option>
</select>

<table id="maplist">
    <tr data-val="a"><td>A</td></tr>
    <tr data-val="a"><td>A</td></tr>
    <tr data-val="b"><td>B</td></tr>
    <tr data-val="b"><td>B</td></tr>
    <tr data-val="c"><td>C</td></tr>
</table>

我的猜测是，您在代码中发送了一个错误的筛选值，这就是为什么人们希望看到您的HTML

---

查看此提琴：

行是否具有ID或类？如何将select值与行匹配？是否尝试在不显示/隐藏的情况下使用

选项

值来查看查询和筛选器是否返回未隐藏的tr？此外，您还需要使用回调或

.then（）

来延迟筛选。好的，这里有更多的解释。my my table的html看起来像某个学校某个酒店my select看起来像此学校酒店ik希望通过选择来过滤表行，其中选项值=Hidden字段的值

$('select#selcat').change(function() {
    $("#maplist tr").hide().filter($(this).val()).show();
}).change();