Javascript 依赖于多个select标记的筛选表

我正在使用jquerydatatable，我想使用多个select标记来筛选datatable，但目前我可以使用1个select标记进行筛选。一个选择标记用于一列，另一个选择标记用于另一列。select标记应在“或”和“和”条件下工作，以过滤数据表。我正在分享代码片段。请提供一些建议，使其发挥作用

HTML

<select id="cato" class="form-control">
  <option disabled selected="true">-Select Category-</option>
  <option>Electronics</option>
  <option>Sports</option>
</select>

<select id="subo" class="form-control">
   <option disabled selected="true">-Select Subcategory-</option>
   <option>Laptop</option>
   <option>Mobile</option>
 </select>

<table id="example" class="table display">
  <thead>
    <tr>
      <th>Product</th>
      <th>Subcategory</th>
      <th>Category</th>
    </tr>
  </thead>
  <tbody id="r">
    <tr>
      <td>Samsung</td>
      <td>Mobile</td>
      <td>Electronics</td>
    </tr>
    <tr>
      <td>Racket</td>
      <td>Tennis</td>
      <td>Sports</td>
    </tr>
    <tr>
      <td>Bat</td>
      <td>Cricket</td>
      <td>Sports</td>
    </tr>
    <tr>
      <td>Dell</td>
      <td>Laptop</td>
      <td>Electronics</td>
    </tr>
    <tr>
      <td>Iphone</td>
      <td>Mobile</td>
      <td>Electronics</td>
    </tr>
    <tr>
      <td>Soccer Ball</td>
      <td>Soccer</td>
      <td>Sports</td>
    </tr>
  </tbody>
</table>

-选择类别-
数码产品
体育
-选择子类别-
笔记本电脑
可移动的
产品
子类别
类别
三星
可移动的
数码产品
球拍
网球
体育
球棒
板球
体育
戴尔
笔记本电脑
数码产品
苹果手机
可移动的
数码产品
足球
足球
体育

Jquery

<script>
var table = $('#example').DataTable({
  "bLengthChange": false,
  pageLength: 3,
  dom: 'tip'
});
  
$.fn.dataTable.ext.search.push(
    function( settings, data, dataIndex ) {        
        var filter= $("#cato option:selected").text().toUpperCase();
        var subCategory = String(data[2]).toUpperCase(); 
        if ( filter == subCategory )
            return true;
        else
            return false;
    }
);  
$('#cato').on('change', function() {
  table.draw()
});
</script>

变量表=$（'#示例'）。数据表({
“bLengthChange”：false，
页长：3，
多姆：“小费”
});
$.fn.dataTable.ext.search.push(
函数（设置、数据、数据索引）{
var filter=$（“#cato选项：选中”）.text（）.toUpperCase（）；
var subCategory=String（数据[2]）.toUpperCase（）；
如果（过滤器==子类别）
返回true；
其他的
返回false；
}
);  
$（'#cato'）。on（'change'，function（）{
表1.draw（）
});

也许您可以使用Datatable colums筛选：

这样的东西怎么样：

var table=$（'#示例'）.DataTable({
“bLengthChange”：false，
//搜索：假，
页长：2，
多姆：“小费”
});
$.fn.dataTable.ext.search.push(
功能（设置、数据、数据索引）{
var filterCategory=$（“#cato选项：选中”）.text（）.toUpperCase（）；
var filterSubCategory=$（“#subo选项：选中”）.text（）.toUpperCase（）；
var subCategory=String（数据[1]）.toUpperCase（）；
var category=String（数据[2]）.toUpperCase（）；
//console.log（filterSubCategory）；
如果（过滤器子类别！=“-选择子类别-”）{
if（filterCategory==类别和filterSubCategory==子类别）
返回true；
}
else if（过滤器类别！=“-选择类别-”）{
if（过滤器类别==类别）
返回true；
}
返回false；
}
);
$（'#cato'）。on（'change'，function（）{
$（'#subo'）.val（“”）；
table.draw（）；
});
$（'#subo'）。on（'change'，function（）{
table.draw（）；
});

-选择类别-
数码产品
体育
-选择子类别-
笔记本电脑
可移动的
产品
子类别
类别
三星
可移动的
数码产品
球拍
网球
体育
球棒
板球
体育
戴尔
笔记本电脑
数码产品
苹果手机
可移动的
数码产品
足球
足球
体育
如果代码有效，只需添加另一个过滤器即可

function( settings, data, dataIndex ) {        
        var filterCato= $("#cato option:selected").text().toUpperCase();
        var filterSubo= $("#subo option:selected").text().toUpperCase();

        var category = String(data[2]).toUpperCase(); 
        var subCategory = String(data[1]).toUpperCase(); 
        
        if ( filterSubo == subCategory || filterCato==category )
            return true;
        else
            return false;
    }

感谢您的回复，但我使用了多个选择标签，列过滤只适用于单个列。对于您的答案，如果从选择标签1中选择了“电子设备”，则它应在或条件下工作，但如果没有从选择标签2中选择任何内容。所有的电子设备都应该显示出来我很抱歉！那部分我不清楚。所以，如果我理解正确的话，只有当两个select控件都有值时，过滤器才会应用AND条件，对吗？是的。如果选择了这两个选项，那么它们都可以工作；如果选择了这两个选项中的任何一个，那么它们都可以工作，并且有必要使用单选按钮吗？@Karthik，没有。我很抱歉。我这样做是因为我不确定您希望如何应用OR条件。我刚刚编辑了我的示例。请你看一下好吗？谢谢你，救命先生