在（禁用）輸入字段上的搜索功能

Question

我有一個用於信息表的簡單搜索功能，但是由於我已將表中的文本轉換為可編輯字段，因此搜索功能不再起作用。

我試圖以幾種不同的方式對它進行故障排除，但似乎無法使其正常工作。

到目前為止，這是我得到的：

var $rows = $('.list #data');
$('#search').keyup(function() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

$rows.show().filter(function() {
    var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
    return !~text.indexOf(val);
}).hide();
});

這在簡單的純文本表上很好用。 這是一個JSFiddle，它向您展示了我要完成的工作：

https://jsfiddle.net/je9mc9jp/8/

Answer 1

//SEARCH
var $rows = $('.list input');
$('#search').keyup(function() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

    $rows.show().filter(function() {
        var text = $(this).val().replace(/\s+/g, ' ').toLowerCase();
        return !~text.indexOf(val);
    }).hide();
});

Answer 2

與我的一個朋友對這個問題進行了更深入的探討，我們設法得到了我們想要的工作。

鮑勃的回答很好，但是問題是它不會返回整行結果。 只是您搜索的特定字詞！

這對我有用：

var $rows = $('.list .edit');
$('#search').keyup(function() {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();
        $rows.parents("tr").hide()
    var x = $rows.show().filter(function() {
        var text = $(this).val().replace(/\s+/g, ' ').toLowerCase();

        if(text.indexOf(val) > -1)
            return $(this);
    });     

    $(x).each(function(){
        $(this).parents("tr").show();
    });
});

JSFiddle演示