-1

我正在寻找过滤文本输入,组合框正在工作,但文本框正在老化。我想要过滤名称,但我不知道该怎么做。

组合框用于年龄,文本字段用于名称。

HTML

所有年龄 16 18 20

<input />
 <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>

        <tr>
        <td><span>wewex</span>

        </td>
        <td>20</td>
    </tr>
     </tbody>
</table>

jQuery

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:last-child').text())
        }).show();
        $trs.not($valid).hide()

}

$('input, select').on('keyup change', function () {   
    if($(this).val() !== ""){
       filter(this);  
     } else{
        $('.AvailableGroupLab tbody tr').show();
    }

})

小提琴链接

4

1 回答 1

1

我对您的代码进行了一些更改。试试这个:

function filter(element) {

         var $trs = $('.AvailableGroupLab tbody tr').hide();
        var regexp = new RegExp($(element).val(), 'i');  
        var $valid = $trs.filter(function () {
            return isNaN($(element).val())?regexp.test($(this).find('td:first-child span').text()):regexp.test($(this).find('td:last-child').text());
        }).show();
        $trs.not($valid).hide()

}

$('input, select').on('keyup change', function () {   
    if($(this).val() !== ""){
       filter(this);  
     } else{
        $('.AvailableGroupLab tbody tr').show();
    }

})

JSFiddle:http: //jsfiddle.net/NpLDn/1/

新 JSFiddle(带过滤器):http: //jsfiddle.net/NpLDn/4/

于 2013-09-26T05:01:08.577 回答