Javascript 数据表隐藏行
我需要帮助来隐藏数据表中的行，Javascript 数据表隐藏行,javascript,jquery,datatables,Javascript,Jquery,Datatables,我需要帮助来隐藏数据表中的行， 当用户从下拉列表中选择“全部显示”时，应呈现完整的数据表， 否则，当用户选择“隐藏美国”时， 我想隐藏其国家/地区列值为“USA”的行 因此，需要某种类型的隐藏/显示切换功能，根据列的值来切换数据表。 这是我的示例代码- <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</ti
当用户从下拉列表中选择“全部显示”时，应呈现完整的数据表，
否则，当用户选择“隐藏美国”时，
我想隐藏其国家/地区列值为“USA”的行
因此，需要某种类型的隐藏/显示切换功能，根据列的值来切换数据表。
这是我的示例代码-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://code.jquery.com/jquery-1.12.3.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">
<script type="text/javascript">
$(document).ready(function() {
var table = $('#example').DataTable();
$("#choice").on("change",function(){
var _val = $(this).val();
if(_val == 2){
table
.columns(2)
.search('USA',true)
.draw();
}
else{
table
.columns()
.search('')
.draw();
}
});
} );
</script>
<style>
#choice{
width: 135px;
height: 35px;
margin-bottom: 20px;
}
</style>
</head>
<body>
<select name="choice" id="choice">
<option value="1">Show All</option>
<option value="2">Hide USA</option>
</select>
<table id="example" class="display" cellspacing="0" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
<th>Country</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Name</th>
<th>Age</th>
<th>Country</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Tiger Nixon</td>
<td>61</td>
<th>USA</th>
</tr>
<tr>
<td>Garrett Winters</td>
<td>63</td>
<th>USA</th>
</tr>
<tr>
<td>Ashton Cox</td>
<td>61</td>
<th>Mexico</th>
</tr>
<tr>
<td>Cedric Kelly</td>
<td>45</td>
<th>Brazil</th>
</tr>
<tr>
<td>Airi Satou</td>
<td>56</td>
<th>Japan</th>
</tr>
</tbody>
</table>
</body>
</html>
文件
$（文档）.ready（函数（）{
变量表=$（“#示例”）.DataTable（）；
$（“#选择”）。关于（“更改”，函数（）{
var_val=$（this.val（）；
如果（_val==2）{
桌子
.栏目（2）
.search（'USA'，true）
.draw（）；
}
否则{
桌子
.columns（）
.搜索（“”）
.draw（）；
}
});
} );
#选择{
宽度：135px；
高度：35px；
边缘底部：20px；
}
全部展示
隐藏美国
名称
年龄
国家
名称
年龄
国家
老虎尼克松
61
美国
加勒特温特斯
63
美国
阿什顿考克斯
61
墨西哥
塞德里克·凯利
45
巴西
佐藤航空
56
日本
然而，我想隐藏“Country”列包含“USA”的行，您可以使用DataTable，并使用regex指定值，例如： 隐藏非61岁年龄段
table
.columns(1)
.search('^(?:(?!61).)*$\r?\n?', true, false)
.draw();
table
.columns()
.search('')
.draw();
table
.columns(2) //The index of column to search
.search('^(?:(?!USA).)*$\r?\n?', true, false) //The RegExp search all string that not cointains USA
.draw();
结果：这就像是一个“给我代码”的问题。你还没有真正表现出你的努力。一个快速的谷歌搜索会带来很多好的结果。对不起，我已经更新了我尝试的内容和一些相关的逻辑，很抱歉我不能分享我的实际项目代码，这就是为什么最初的简短问题。嗨，你能给我解释一下这个搜索参数“^（？：（？！61）。*$\r？\n”的意思吗？以及真参数和假参数的含义，您传递给search的是哪个？@AniruddhaRaje第一个参数是RegExp
^（？（？！61）。*$\r？\n？61