如何隱藏的表，它的第三個單元格的值不JQuery的

一個給定的字符串匹配的任何行，如果我有一個表：如何隱藏的表，它的第三個單元格的值不JQuery的

<table id="myTable"> 
    <tr> 
     <td>1</td><td>2</td><td>NoMatch</td><td>4</td> 
    </tr> 
    <tr> 
     <td>1</td><td>2</td><td>Match</td><td>4</td> 
    </tr> 
</table>

我一直在努力：

$(document).ready(function() { 
    $('input#myInput').keyup(function (val) { 
     // for each third td of each row, if this value does not contain: this.val() then hide it 
    }); 
});

來源

2011-12-21 some_bloody_fool

所以，你會想'NoMatch'列隱藏，如果你在'input'類型'Match'？ – 2011-12-21 00:41:27

@AndrewWhitaker，是的，這是我的目標 – 2011-12-21 00:43:35

事情是這樣的：

var $cells = $('#myTable tr td:nth-child(3)'), 
    $hidden = $(); 

$('#myInput').keyup(function() { 
    var search = this.value; 

    var $to_hide = $cells.filter(function() { 
     return $(this).text() !== search; 
    }).parent(); 

    $hidden.not($to_hide.get()).show(); 
    $hidden = $to_hide.hide(); 
});

我認爲，當你說包含，你的意思是文本具有等於所提供的輸入（否則NoMatch和Match就沒有意義）。但是，如果單元格的內容只需將搜索字符串作爲子字符串包含，則可以使用.indexOf()^[docs]。

DEMO

有你要考慮，當搜索字符串是空的像應該發生什麼其他的事情，但是這是你玩;）

來源

2011-12-21 00:51:59

謝謝！真是一個偉大的網站！！ – 2011-12-21 00:57:59

使用「這個「在你的鍵盤事件處理程序中獲取輸入的值。

 $(document).ready(function() { 
      $('input#myInput').keyup(function() { 
       //add if statement 
       alert($(this).val()); 
      }); 
     });

不太清楚你想用表格做什麼。沒有足夠的信息。

來源

2011-12-21 00:39:14

或乾脆'this.value' – 2011-12-21 00:40:31

試試這個： jsfiddle

HTML

<table id="myTable"> 
    <tr> 
     <td>1</td><td>2</td><td>NoMatch</td><td>4</td> 
    </tr> 
    <tr> 
     <td>1</td><td>2</td><td>Match</td><td>4</td> 
    </tr> 
</table> 

<input id="myInput"/>

使用Javascript/jQuery的

$('#myInput').keyup(function() { 
    var me = $(this); 
    var val = me.val(); 

    $("#myTable tr").each(function() { 
     var tr = $(this); 
     var td = tr.find("td:eq(2)"); 

     if(td.text().substring(0, val.length) === val) { 
      tr.show(); 
     } else { 
      tr.hide(); 
     } 
    }); 
});

來源

2011-12-21 01:14:18 kasdega

如何隱藏的表，它的第三個單元格的值不JQuery的

回答

相關問題