我的实时搜索存在问题,过滤正在运行,但我想要的只是<td>
标记可以过滤且<th>
不属于。
这是我的HTML
<input />
<table class="AvailableGroupLab availGrpLabs avalLabs">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td><span>wewe</span>
</td>
<td>16</td>
</tr>
<tr>
<td><span>Melvin</span>
</td>
<td>18</td>
</tr>
<tr>
<td><span>Marvin</span>
</td>
<td>20</td>
</tr>
</table>
和javascript
function filter(element) {
var $trs = $('.AvailableGroupLab tr').hide();
var regexp = new RegExp($(element).val(), 'i');
var $valid = $trs.filter(function () {
return regexp.test($(this).find('td:first-child').text())
}).show();
$trs.not($valid).hide()
}
$('input').on('keyup change', function () {
filter(this);
})
答案 0 :(得分:3)
试试这个:
function filter(element) {
var $trs = $('.AvailableGroupLab tr').not(":first").hide(); //don't hide first tr
var regexp = new RegExp($(element).val(), 'i');
var $valid = $trs.filter(function () {
return regexp.test($(this).find('td:first-child').text())
}).show();
$trs.not($valid).hide()
}
$('input').on('keyup change', function () {
filter(this);
})
答案 1 :(得分:3)
我猜您需要使用:not(:first-child)
function filter(element) {
var $trs = $('.AvailableGroupLab tr:not(:first-child)').hide();
var regexp = new RegExp($(element).val(), 'i');
var $valid = $trs.filter(function () {
return regexp.test($(this).find('td:first-child').text())
}).show();
$trs.not($valid).hide()
}
$('input').on('keyup change', function () {
filter(this);
})
答案 2 :(得分:1)
您可以使用tbody
和thead
演示: http://jsfiddle.net/svHfj/2/
<table class="AvailableGroupLab availGrpLabs avalLabs">
<thead>
<tr>
<th>Name</th>
<th>Age</th>
</tr>
</thead>
<tbody>
<tr>
<td><span>wewe</span>
</td>
<td>16</td>
</tr>
<tr>
<td><span>Melvin</span>
</td>
<td>18</td>
</tr>
<tr>
<td><span>Marvin</span>
</td>
<td>20</td>
</tr>
</tbody>
</table>
和js
function filter(element) {
var $trs = $('.AvailableGroupLab tbody tr').hide();
var regexp = new RegExp($(element).val(), 'i');
var $valid = $trs.filter(function () {
return regexp.test($(this).find('td:first-child').text())
}).show();
$trs.not($valid).hide()
}
$('input').on('keyup change', function () {
filter(this);
})
答案 3 :(得分:0)
答案 4 :(得分:0)
here 是您问题的解决方案。
使用$('.AvailableGroupLab tr:not(:has(tr)):odd')
代替$('.AvailableGroupLab tr')
function filter(element) {
var $trs = $('.AvailableGroupLab tr:not(:has(tr)):odd').hide();
var regexp = new RegExp($(element).val(), 'i');
var $valid = $trs.filter(function () {
return regexp.test($(this).find('td:first-child').text())
}).show();
$trs.not($valid).hide()
}
答案 5 :(得分:0)
只需从选择器中删除元素
即可function filter(element) {
var $trs = $('.AvailableGroupLab tr');
$trs.each(function() {
if ( $(this).find('th').length) { // if th remove it
$trs = $trs.not($(this));
}
});
$trs.hide();
var regexp = new RegExp($(element).val(), 'i');
// also you don't need filter
$trs.each(function () {
if (!regexp.test($(this).find('td:first-child').text())) return;
$(this).show();
});
}
$('input').on('keyup change', function () {
filter(this);
});