jQuery列の非表示

Question

私は列ヘッダーと同じ名前でドロップダウンを持っています。

<select id='showHideColumns'> 
<option value='-1'> Show all </option> 
<option value='GroupA'> GroupA </option> 
<option value='GroupB'> GroupB </option> 
</select> 

私のコラムは、私はjqueryのを使用して/非表示の列を表示することができますどのように<td class='GroupA'> //data </td>

のような値と同じ名前を持っていますか？

私はこれだけ多くのuptill知っている：

私はラインの何かを期待していた：この

の確認 ($("#showHideColumns).val().toggle()なく

if($("#showHideColumns).val()=="GroupA") 
$(".GroupA").toggle() 
else if ($("#showHideColumns).val()=="GroupB") 
$(".GroupB").toggle() 

は、私は上記のコードを減らすことができます

誰かが私が上記の行を減らすのを助けるなら、本当に大きな助けになるでしょう。

Answer 1

$('.' + $('#showHideColumns').val()).toggle();このトリックを行う必要があります。あなたは近くにいた。

Answer 2

Tyrのすべての列を選択する必要があるものは何でもセレクタであることを'table td'設定し、この

if($("#showHideColumns").val() != -1) 
     $("."+$("#showHideColumns").val()).toggle() 

Answer 3

$('#showHideColumns').change(function() { 
    $('table td').hide().('.'+$(this).val()).show(); 
}); 

。すべての列を最初に非表示にしていない場合、特定の列を選択すると、他の列は消えません。