javascript - 使用“搜索”方法按文本过滤和标签

Question

<li>此函数当前通过元素内的文本过滤元素<li>。我怎样才能修改它，以便它也可以通过<li>标签内的文本过滤（例如数据属性）>。

我已经尝试更改($(this).text().search(...))为，($(this).search(...))但这只是阻止了该功能完全正常工作。

我在这里发布了一个带有工作示例的小提琴：http: //jsfiddle.net/chayacooper/sMEbN/

$(document).ready(function () {
    $('#list li').addClass('visible');
    $('#search').show();    
    $('#filter').keyup(function(event) {
    if (event.keyCode == 27 || $(this).val() == '') {
            $(this).val('');    
            $('#list li').removeClass('visible').show().addClass('visible');
    }         
        else {
            filter('#list li', $(this).val());
    }
    });
});

function filter(selector, query) {
  query = $.trim(query);
  query = query.replace(/ /gi, '|');   
  $(selector).each(function() {
    ($(this).text().search(new RegExp(query, "i")) < 0) ? $(this).hide().removeClass('visible') : $(this).show().addClass('visible');
  });
}

Answer 1

你可以尝试这样的事情：

$(selector).each(function () {
    var data = $.map($(this).data(), function (el) {
        return el;
    }).join(' ');
    ($(this).text() + ' ' + data).search(new RegExp(query, "i")) < 0 
        ? $(this).hide().removeClass('visible')
        : $(this).show().addClass('visible');
});

http://jsfiddle.net/sMEbN/5/

$(this).data()返回所有数据属性，然后可以将其连接成字符串。