大佬教程收集整理的这篇文章主要介绍了在JQuery中单击按钮时向表添加新行，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<script type="text/javascript">
var $= jQuery.noConflict();
$("#addrows").click(function () {
if (document.getElementById("hiddenprice").value == "") {
imagecounter = 4;
} else {
imagecounter = parseFloat(document.getElementById("hiddenprice").value) +1;
}
//imagecounter=4;
var newImageDiv = $(document.createElement('div'))
.attr("id",'add_div' + imagecounter);
newImageDiv.after().html('<table width="100%" cellpadding="0"
cellspacing="0" class="pdzn_tbl1" border="0">' +
'<tr><td><input type="text" name="rollno<? $i ?>"/></td>' +
'<td><input type="text" name="firstname<? $i ?>" /></td>' +
'<td><input type="text" name="lastname<? $i ?>" /></td></tr></table>');
newImageDiv.appendTo("#addgroup");
$("tr:last").after(newImageDiv);
document.getElementById("hiddenprice").value = imagecounter;
imagecounter++;
});
</script>
<div class="common" style="width:1040px; -overflow-x:scroll; padding: 5px 5px 0 5px;">
<table id="maintable" width="50%" cellpadding="0" cellspacing="0" class="pdzn_tbl1" border="#729111 1px solid" >
<tr>
<th>Roll No</th>
<th>First Name</th>
<th>Last Name</th>
</tr>
<?PHP $t_row=3; for($i=1;$i<=$t_row;$i++) { ?>
<tr id="rows">
<div>
<td><input type="text" name="rollno<? $i ?>"/></td>
<td><input type="text" name="firstname<? $i ?>"/></td>
<td> <input type="text" name="lastname<? $i ?>"/></td>
</div>
</tr>
<? } ?>
<div id="addgroup">
<div id="add_div1"> </div>
</div>
<table>
<input type="button" name="add" value="+Add" id="addrows" />
<input type="hidden" id="hiddenprice" name="hiddenprice" value="3"/>
</table>
</div>
$("#addrows").click(function () {
$("#mytable").each(function () {
var tds = '<tr>';
jQuery.each($('tr:last td',this),function () {
tds += '<td>' + $(this).html() + '</td>';
});
tds += '</tr>';
if ($('tbody',this).length > 0) {
$('tbody',this).append(tds);
} else {
$(this).append(tds);
}
});
});
更新：
这里div关闭在错误的地方,它应该在tr关闭之前结束,可能就是那个错误
<tr id="rows"> <div style="padding-left: 5px"> <td style="padding:5px;" > <input type="text" name="rollno<? $i ?>" /> </td> <td style="padding:5px;"> <input type="text" name="firstname<? $i ?>" /> </td> <td style="padding:5px;"> <input type="text" name="lastname<? $i ?>" /> </td> </div> // right </tr> </div> // wrong
以上是大佬教程为你收集整理的在JQuery中单击按钮时向表添加新行全部内容，希望文章能够帮你解决在JQuery中单击按钮时向表添加新行所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。