Javascript addClass具有来自find的多个结果

我使用此函数将类

hide

添加到包含变量

text

值的表行中。问题是，通常my

selected

td

可以获得两个值，但此函数仅适用于一个值

我的桌子：

<div id="csvtextcomptb" class="tableunform"><table cellspacing="1" 
cellpadding="1" border="1"><thead><tr><th>TABLE</th><th>TAG</th><th>DATE</th><th>STATUS</th><th>Key</th><th>Prev</th></tr></thead>
<tbody><tr><td>COMP</td><td> COMP_TRUCK </td><td>17/10/2017</td><td>Prev(1)</td><td>CA5520</td><td>MP &lt; 1K</td></tr>
<tr class="hide"><td>COMP</td><td> COMP_TRUCK </td><td>17/10/2017</td><td>Prev(2)</td><td>CA5520</td><td>MP &gt; 1K</td></tr>
<tr class="hide"><td>COMP</td><td> COMP_TRUCK </td><td>17/10/2017</td><td>Prev(2)</td><td>CA5534</td><td>MP &gt; 1K</td></tr>
<tr class="hide"><td>COMP</td><td>COMP_TRUCK </td><td>17/10/2017</td><td>Prev(2)</td><td>CA5328</td><td>MP &gt; 1K</td></tr></tbody></table></div>

<table id="filter_crca">
    <tbody>
        <tr>
            <td class="pointer selected">MP &lt; 1K</td>
            <td class="pointer">MP &gt; 1K</td>
        </tr>
    </tbody>
</table>

我如何更改此函数以读取选择了

的
td
类的那些值，并将它们合并以添加或删除
隐藏

谢谢
 希望这就是你想要的：


$（文档）。在（“单击”上，“[id*='filter_']tbody td”，函数（e）{
var prev=$（this.text（）.trim（）；
var tbid=$（this）.closest（'table'）.attr（'id'）；
var regExp=/[^\*过滤器\]\w+/；
var tableid=regExp.exec（tbid.toString（））；
var tipotb=tableid.toString（）.split（“”“）[0]；
//添加代码
$（'#filter'+tableid）.find（“td”）.not（this.removeClass（'selected'）；
$（this.toggleClass（'selected'）；
var text=$（'#filter'+tableid）.find（“td.selected”）.text（）；
$（'#csvtext'+tipotb+'tb tbody tr'）.addClass（“隐藏”）；
//结束
$（“#csvtext'+tipotb+'tb tbody'）。查找（“tr:contains”（“+tableid.toString（）.toUpperCase（）+”）：contains（“+text+”））。removeClass（'hide'）；
//$（“#csvtext'+tipotb+'tb tbody'）.find（“tr:contains”（“+tableid.toString（）.toUpperCase（）+”）：not（：contains（“+text+”））））））.addClass（'hide'）；
});
。已选定{
颜色：红色；
}
.隐藏{
显示：无；
}

桌子
标签
日期
地位
钥匙
上
公司
复合卡车
17/10/2017
上（1）
CA5520
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5520
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5534
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5328
MP 1K
MP 1K
MP 1K
希望这就是您想要的：


$（文档）。在（“单击”上，“[id*='filter_']tbody td”，函数（e）{
var prev=$（this.text（）.trim（）；
var tbid=$（this）.closest（'table'）.attr（'id'）；
var regExp=/[^\*过滤器\]\w+/；
var tableid=regExp.exec（tbid.toString（））；
var tipotb=tableid.toString（）.split（“”“）[0]；
//添加代码
$（'#filter'+tableid）.find（“td”）.not（this.removeClass（'selected'）；
$（this.toggleClass（'selected'）；
var text=$（'#filter'+tableid）.find（“td.selected”）.text（）；
$（'#csvtext'+tipotb+'tb tbody tr'）.addClass（“隐藏”）；
//结束
$（“#csvtext'+tipotb+'tb tbody'）。查找（“tr:contains”（“+tableid.toString（）.toUpperCase（）+”）：contains（“+text+”））。removeClass（'hide'）；
//$（“#csvtext'+tipotb+'tb tbody'）.find（“tr:contains”（“+tableid.toString（）.toUpperCase（）+”）：not（：contains（“+text+”））））））.addClass（'hide'）；
});
。已选定{
颜色：红色；
}
.隐藏{
显示：无；
}

桌子
标签
日期
地位
钥匙
上
公司
复合卡车
17/10/2017
上（1）
CA5520
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5520
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5534
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5328
MP 1K
MP 1K
MP 1K
我不知道下面的代码片段是否是您需要的，但是我已经在您的代码中设置了一些更改，以满足您的需求，而且您有错误的表关联到它的筛选器id

请参阅下面的代码片段：


$（文档）。在（“单击”上，“[id*='filter_']tbody td”，函数（e）{
$（this.toggleClass（'selected'）；
var prev=$（this.text（）.trim（）；
var tbid=$（this）.closest（'table'）.attr（'id'）；
var regExp=/[^\*过滤器\]\w+/；
var tableid=regExp.exec（tbid.toString（））；
var tipotb=tableid.toString（）.split（“”“）[0]；
$（'csvtext'+tipotb+'tbtbtbody'）.find（“tr”）.addClass（“hide”）；
$（'#filter'+tableid）.find（“td”）.each（function（）{
if（$（this）.hasClass（“选定”））{
var text=$（this.text（）；
$（'#csvtext'+tipotb+'tb tbody'）。查找（“td:contains（''+text+'））））。父级（'tr'）。removeClass（'hide'）；
}
});
});
.pointer{
光标：指针；
边框：1px纯黑；
}
.选定{
颜色：红色；
字体大小：粗体；
}
.隐藏{
显示：无；
}

桌子
标签
日期
地位
钥匙
上
公司
复合卡车
17/10/2017
上（1）
CA5520
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5520
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5534
MP 1K
公司
复合卡车
17/10/2017
上（2）
CA5328
MP 1K
MP 1K
MP 1K
我不知道下面的代码片段是否是您需要的，但是我已经在您的代码中设置了一些更改，以满足您的需求，而且您有错误的表关联到它的筛选器id

请参阅下面的代码片段：


$（文档）。在（“单击”上，“[id*='filter_']tbody td”，函数（e）{
$（this.toggleClass（'selected'）；
var prev=$（this.text（）.trim（）；
var tbid=$（this）.closest（'table'）.attr（'id'）；
var regExp=/[^\*过滤器\]\w+/；
var tableid=regExp.exec（tbid.toString（））；
var tipotb=tableid.toString（）.split（“”“）[0]；
$（'csvtext'+tipotb+'tbtbtbody'）.find（“tr”）.addClass（“hide”）；
$（'#filter'+tableid）.find（“td”）.each（function（）{
if（$（this）.hasClass（“选定”））{
var text=$（this.text（）；
$（'#csvtext'+tipotb+'tb tbody'）。查找（“td:contains（''+text+'））））。父级（'tr'）。removeClass（'hide'）；
}
});
});
.pointer{
光标：指针；
边框：1px纯黑；
}
.选定{
颜色：红色；
字体大小：粗体；
}
.隐藏{
显示：无；
}
$(document).on("click","[id*='filter_'] tbody td", function(e){

    $(this).toggleClass('selected');
    var prev = $(this).text().trim();
    var tbid = $(this).closest('table').attr('id');
    var regExp = /[^\*filter_]\w+/;
    var tableid = regExp.exec(tbid.toString());

    var tipotb = tableid.toString().split('_')[0]; 

    var text = $('#filter_' + tableid).find("td").map(function(){

        if( $(this).hasClass("selected") ) {

            return $(this).text()

        }

}).get();

     $.each(text, function(index, value){

            $('#csvtext' + tipotb + 'tb tbody').find("tr:contains('" + tableid.toString().toUpperCase() + "'):contains('" + value + "')").removeClass('hide');
            $('#csvtext' + tipotb + 'tb tbody').find("tr:contains('" + tableid.toString().toUpperCase() + "'):not(:contains('" + value + "'))").addClass('hide');
            });
});