使用jQuery的on数据属性过滤表 [英] Filter table with on data attribute with jQuery

问题描述

我试图基于data属性而不是 td 标记内的值过滤表.

I am trying to filter a table based on data attribute, instead on value inside the td tag.

问题是，我无法使它正常工作，因为我总是会收到此错误:

The problem is, that I can't get it to work, because I always get this error:

未捕获的TypeError:无法调用未定义的方法"match"

$(document).ready(function(){
    var elemens = $("td")
    searchInput = $("#search")
    searchInput.on('keyup',function(){

        elemens.each(function(){

            var re = new RegExp(searchInput.val(), 'gi');
            if( $(this).data('gui').match(re) === null )
            {
                $(this).parent('tr').hide();
            }else{
                $(this).parent('tr').show();
            }

        });                
    });
});​

我的小提琴: http://jsfiddle.net/T57ba/3/

推荐答案

数据属性位于tr而不是td上， .data()也会转换适用的类型，在这种情况下为数字.而是使用 .attr()

The data attributes are on the tr not the td, also .data() will convert the applicable types, in this case numbers. Instead use .attr()

$(document).ready(function(){
    var elemens = $("tr")
    searchInput = $("#search")
    searchInput.on('keyup',function(){            
        elemens.each(function(){                
            var re = new RegExp(searchInput.val(), 'gi');
            if( $(this).attr('data-gui').match(re) === null ){
                $(this).hide();
            }
            else{
                $(this).show();
            }

        });                
    });
});​

演示

这篇关于使用jQuery的on数据属性过滤表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！