如何展開/摺疊並在點擊按鈕時將新行添加到div

Question

我有一些div，當點擊按鈕展開/摺疊我需要一個函數，允許我的客戶端在窗體上添加更多的div像圖片上的附着

我曾嘗試follwing代碼，它的按鈕點擊不工作時，什麼都不會發生

<div class="divVisible" id="mytable"> 
<p><label class="field2">Centro de Custo:</label><input type="text" class="text" id="centroCusto" name="centroCusto"></p> 
<p><label class="field">Conta Contabil:</label><input type="text" class="text" id="contaContabil" name="contaContabil"/></p> 
<p><label class="field">Periodo:</label><input type="text" class="num" id="date" name="date"/></p> 
<p><label class="field">Saldo:</label><input type="text" class="num" id="saldo" name="saldo"/></p> 
<p><label class="field">Saldo Total:</label><input type="text" class="num" id="saldoTotal" name="saldoTotal"/></p> 
</div> 
<input id="show_hide" type="button" value="Collapse/Expand" /> 
</div> 
</fieldset> 
</form> 
</body> 
<script type="text/javascript"> 
$("#show_hide").click(function() { 
$("#mytable").append('<p><label class="field">Saldo:</label><input type="text" class="num" id="saldo" name="saldo"/></p>'); 
}); 
</script> 

Answer 1

如果追加那你就只能創建每個新元素的HTML當你點擊。您始終可以在頁面上使用display:none，然後使用jQuery .toggle()或.slideToggle()擴展/摺疊。