我怎樣才能使一個表部分隱藏，然後單擊

Question

這裏後顯示我在做什麼...點擊這裏給按鈕時，其分類表顯示有關細節深藏不露，CSS正在爲我好，問題是，當我點擊在按鈕上顯示tbody沒有任何反應，不能得到它的問題。對我的代碼來看看..

的CSS使他隱藏的，除非他是不是點擊，

.down1 { 
     display: none; 
    } 

$(document).ready(function(){ 
    $("#show1").click(function(){ 
     $(".down1").toggle(); 
    }); 
}); 

<table align="center" cellpadding="10" width="300"> 
    <tr> 
     <th bgcolor="brown"></th> 
     <th bgcolor="brown">Day</th> 
    <tr> 
     <td align="center" bgcolor="lightgrey"> 
      <input type="button" value="+" id="show1" /> 
     </td> 
     <td align="center" bgcolor="lightgrey">Monday</td> 
     <tbody class="down1"> 
    <tr> 
     <td> 
      <input type="checkbox" /> 
     </td> 
     <td>9:00 -10:00 (time) </td> 
    </tr> 
    <tr> 
     <td> 
      <input type="checkbox" /> 
     </td> 
     <td>9:00 -10:00 (time)</td> 
    </tr>  
    <tr> 
     <td> 
      <input type="checkbox" /> 
     </td> 
     <td>9:00 -10:00 (time)</td> 
    </tr> 
    <tr> 
     <td> 
      <input type="checkbox" /> 
     </td> 
     <td>9:00 -10:00 (time)</td> 
    </tr> 
    <tr> 
     <td> 
      <input type="checkbox" /> 
     </td> 
     <td>9:00 -10:00 (time)</td> 
    </tbody> 
    </tr> 
    </tr> 
</table> 

Answer 1

這EXA mple可以幫助你：Example

$(document).ready(function(){ 
    $("#show1").click(function(){ 
    $(".down1").toggle(); 
    if ($(this).val() == '+') { 
     $(this).val('-'); 
    } else $(this).val('+'); 
    }); 
    }); 

Answer 2

不知道，但這個你想要什麼？

的jsfiddle：

http://jsfiddle.net/yoy5xph3/1/

$(".down1").toggle(); 

$("#show1").click(function(){ 
    $(".down1").toggle(); 
}); 

我刪除了CSS和在開始切換的.down1所以它隱藏。

Answer 3

可以顯示我的DEMO CODE

它的工作

jQuery的

$(document).ready(function(){ 
     $("#show1").click(function(){ 
     $(".down1").toggle(); 
     if ($(this).val() == '+') { 
      $(this).val('-'); 
     } else $(this).val('+'); 
    }); 
}); 

標記

<tbody class="down1"> 
     <tr> 
      <td><input type="checkbox" /></td><td>9:00 -10:00 (time) </td> 
     </tr> 
     <tr> 
      <td><input type="checkbox" /></td><td>9:00 -10:00 (time) </td> 
     </tr> 
     <tr> 
      <td><input type="checkbox" /></td><td>9:00 -10:00 (time) </td> 
     </tr> 
     <tr> 
      <td><input type="checkbox" /></td><td>9:00 -10:00 (time) </td> 
     </tr> 
     <tr> 
      <td><input type="checkbox" /></td><td>9:00 -10:00 (time) </td> 
     </tr> 
</tbody>