例如，我有三個這樣的單選按鈕：
? 0-30
? 30-90
? 90-100
和表：
| ID | 姓名 | 埃塔 |
|---|---|---|
| 1 | 斯塔 | 0-30 |
| 2 | 丹尼 | 30-90 |
| 3 | 艾麗 | 90-100 |
JSFiddle： https ://jsfiddle.net/Carla102030/28r7oxwf/5/
我的目標是：當用戶選中第一個單選按鈕時，在表中他只能看到具有此值的行，依此類推。所以我想要一個以這種方式作業的 JS 函式。
你能幫我嗎？
uj5u.com熱心網友回復：
您可以使用 jQuery 過濾器功能來檢測值。
$(document).ready(function(){
$('input[name="filter"]').change(function(){
var value = $(this).val().toLowerCase();
if (value === "all"){
$("#myTable tr").show();
} else {
$("#myTable tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
}
});
});.table{
width: 100%;
border: 1px solid #ddd;
}
.table tr, .table th, .table td{
border: 1px solid #ddd;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="radioCont">
<input type="radio" name="filter" value="0-30" id="i1" /> <label for="i1"> 0-30</label> <br />
<input type="radio" name="filter" value="30-90" id="i2" /> <label for="i2"> 30-90</label> <br />
<input type="radio" name="filter" value="90-100" id="i3" /> <label for="i3"> 90-100</label> <br />
<input type="radio" name="filter" value="all" id="i4" checked /> <label for="i4"> All</label> <br />
</div>
<table class="table">
<thead>
<tr>
<th>id</th>
<th>name</th>
<th>età</th>
</tr>
</thead>
<tbody id="myTable">
<tr>
<td>1</td>
<td>Sta</td>
<td>0-30</td>
</tr>
<tr>
<td>2</td>
<td>Danny</td>
<td>30-90</td>
</tr>
<tr>
<td>3</td>
<td>Elle</td>
<td>90-100</td>
</tr>
</tbody>
</table>轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/354011.html
標籤：javascript 查询