これは関数のhtmlおよびjqueryコードです。最初の行が初期化されるので、今度は同じボタンで何回もボタンをクリックすると隠し行が呼び出されます。私は空のtbody
を作成し、それに新しい行を追加することをお勧めが、ここに私のコードは、これまでJQueryでonclickを使用してテーブルに非表示の行を挿入する方法
<!-- Jquery button click function -->
$(function() {
$('button').click(function() {
$('#other_tr').show()
var clone = $('#other_tr').clone;
$('#first_tr').after(clone)
})
});
<html>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<thead>
<tr id="first_tr">
\t \t \t <th>Unit price</th>
\t \t \t <th>Discount</th>
\t \t \t <th>Total</th>
\t \t \t </tr>
<!-- hidden row -->
<tr id="other_tr" style="display: none;">
\t \t \t <th>Unit price</th>
\t \t \t <th>Discount</th>
\t \t \t <th>Total</th>
\t \t \t </tr>
</thead>
</table>
<button>Fetch Row</button>
</body>
</html>