jquery通過select列表選擇框?qū)Ρ砀駭?shù)據(jù)進(jìn)行過濾示例
更新時間:2014年05月07日 11:49:59 作者:
這篇文章主要介紹了jquery通過select列表選擇框?qū)Ρ砀駭?shù)據(jù)進(jìn)行過濾示例,需要的朋友可以參考下
jquery通過select列表選擇框?qū)Ρ砀駭?shù)據(jù)進(jìn)行過濾
表格數(shù)據(jù)
復(fù)制代碼 代碼如下:
<table id="example">
<thead>
<tr>
<th>Name</th>
<th>Surname</th>
</tr>
</thead>
<tbody>
<tr>
<td>Michael</td>
<td>Jordan</td>
</tr>
<tr>
<td>Michael</td>
<td>Jackson</td>
</tr>
<tr>
<td>Bruno</td>
<td>Mars</td>
</tr>
</tbody>
</table>
JS過濾代碼,其中select是動態(tài)生成的
復(fù)制代碼 代碼如下:
$("#example > thead th").each(function(i) {
$("<select />").attr("data-index", i).html($("<option />")).change(function() {
$("#example > tbody > tr").show().filter(function() {
var comb = [], children = $(this).children();
children.each(function(i) {
var value = $("select[data-index='" + i + "']").val();
if (value == $(this).text() || value == "") comb.push(1);
});
return comb.length != children.length;
}).hide();
}).appendTo("body");
});
$("#example > tbody tr").each(function() {
$(this).children().each(function(i) {
var that = $(this);
var select = $("select[data-index='" + i + "']");
if (!select.children().filter(function() {
return $(this).text() == that.text();
}).length) {
select.append($("<option />").text($(this).text()));
}
});
});
您可能感興趣的文章:
- Chosen 基于jquery的選擇框插件使用方法
- jQuery實現(xiàn)選中彈出窗口選擇框內(nèi)容后賦值給文本框的方法
- 基于JQuery的Select選擇框的華麗變身
- 基于jquery實現(xiàn)select選擇框內(nèi)容左右移動添加刪除代碼分享
- 基于jQuery下拉選擇框插件支持單選多選功能代碼
- jquery實現(xiàn)select選擇框內(nèi)容左右移動代碼分享
- 各種選擇框jQuery的選中方法(實例講解)
- Jquery多選下拉列表插件jquery multiselect功能介紹及使用
- 用jquery實現(xiàn)下拉菜單效果的代碼
- 用jquery實現(xiàn)的一個超級簡單的下拉菜單
- jQuery模擬12306城市選擇框功能簡單實現(xiàn)方法示例
相關(guān)文章
jQuery ui autocomplete選擇列表被Bootstrap模態(tài)窗遮擋的完美解決方法
這篇文章主要介紹了jQuery ui autocomplete選擇列表被Bootstrap模態(tài)窗遮擋的完美解決方法,本文介紹的非常詳細(xì),解決過程思路明了,需要的朋友可以參考下2016-09-09
基于jquery的獲取mouse坐標(biāo)插件的實現(xiàn)代碼
用jquery實現(xiàn)的獲取mouse坐標(biāo)的實現(xiàn)代碼,需要的朋友可以參考下。2010-04-04
JQuery使用index方法獲取Jquery對象數(shù)組下標(biāo)的方法
這篇文章主要介紹了JQuery使用index方法獲取Jquery對象數(shù)組下標(biāo)的方法,涉及jQuery中index方法的使用技巧,需要的朋友可以參考下2015-05-05

