- 现在的表是动态的,所以很多行能来,但下拉是静态
- 下拉第2个和第3个值苹果和Orange只能来表第2列和下拉4日和5日值“食”和“烂”只可能在第4列
- 所有的代码应该在功能viewChange()现在
在当Apple
被选中所有具有第二列值的行与苹果将显示等等。隐藏和显示基于一个下拉的值表的行 - jQuery的
选择 - 全部将再次显示整个表格
如何编写函数?
function ViewChange()
{
var selectedViewName = $('#dropDown :selected').val();
switch (selectedViewName)
{
case("1"):
selectedViewName="ALL";
break;
case("2"):
selectedViewName = "Apple";
break;
case("3"):
selectedViewName = "Orange";
break;
case("4"):
selectedViewName = "Fresh";
break
case("5"):
selectedViewName = "Rotten";
break
}
<select id="dropDown" onchange="ViewChange()"><option value="1">All</option>
<option value="2">Apple</option>
<option value="3">Orange</option>
<option value="4">Fresh</option>
<option value="5">Rotten</option>
</select>
<table id="tableID">
<thead>
<tr>
<th>Name</th>
<th>Fruit type</th>
<th>place</th>
<th>state</th>
</tr>
</thead>
<tbody>
<tr>
<td>salim groceries</td>
<td>apple</td>
<td>nagpur</td>
<td>fresh</td>
</tr>
<tr>
<td>monalisa groceries</td>
<td>Apple</td>
<td>Belapur</td>
<td>Rotten</td>
</tr>
<tr>
<td>taj groceries</td>
<td>Orange</td>
<td>Nasik</td>
<td>Fresh</td>
</tr>
<tr>
<td>suraj groceries</td>
<td>Orange</td>
<td>Goa</td>
<td>Rotten</td>
</tr>
</tbody>
</table>
请看看这个小提琴https://jsfiddle.net/shaswatatripathy/pvxmrL2n/8/
你有一个关于这个代码的问题?我只能看到你的要求列表 –
添加了问题 – tripathy
看看这里http:// stackoverflow。com/questions/35632168/i-want-to-toggle-the-table-rows-filter-based-on-the-text-from-buttons/35639792#35639792 – Alexis