有人可以帮助我：
HTML：
<table id="table">
<thead>
<tr>
<th width="8" scope="col"> </th>
<th width="131" scope="col">Roba/Usluga</th>
<th width="144" scope="col">Jmj</th>
<th width="144" scope="col">Količina</th>
<th width="144" scope="col">Jed. cijena</th>
<th width="144" scope="col">Rabat</th>
<th width="81" scope="col"> </th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td>
<select name="sif_roba1" id="sif_roba1">
<option value="">Please select</option>
<option value="1">David Hasselhoff</option>
<option value="2">Michael Jackson</option>
<option value="3">Tina Turner</option>
</select>
</td>
<td>
<select name="idjmj1" id="idjmj1">
<option value="">Please select</option>
<option value="1">David Hasselhoff</option>
<option value="2">Michael Jackson</option>
<option value="3">Tina Turner</option>
</select>
</td>
<td>
<input name="cijena1" id="cijena1">
</td>
<td>
<input name="track1" id="track1">
</td>
<td>
<input name="rabat1" id="rabat1">
</td>
<td>
<button class="remove_button">Remove</button>
</td>
</tr>
</tbody>
</table>
<button type="button" class="add" onClick="clickMe();">Add</button>
JS：
$(document).ready(function ($) {
// trigger event when button is clicked
$("button.add").click(function () {
// add new row to table using addTableRow function
addTableRow($("table"));
// prevent button redirecting to new page
return false;
});
// function to add a new row to a table by cloning the last row and
// incrementing the name and id values by 1 to make them unique
function addTableRow(table) {
rowCount = 0;
$("#table tr td:first-child").each(function () {
rowCount++;
$(this).text(rowCount);
});
// clone the last row in the table
var $tr = $(table).find("tbody tr:last").clone();
// get the name attribute for the input and select fields
$tr.find("input,select").attr("name", function () {
// break the field name and it's number into two parts
var parts = this.id.match(/(\D+)(\d+)$/);
// create a unique name for the new field by incrementing
// the number for the previous field by 1
return parts[1] + ++parts[2];
// repeat for id attributes
}).attr("id", function () {
var parts = this.id.match(/(\D+)(\d+)$/);
return parts[1] + ++parts[2];
});
// append the new row to the table
$(table).find("tbody tr:last").after($tr);
// remove rows
$(".remove_button").live("click", function () {
$(this).parents("tr").remove();
})
};
});
答案 0 :(得分：1)
更新您的要求：
行号修复和添加淡入淡出
$tr.hide();
$(table).find("tbody tr:last").after($tr);
$(table).find("tbody tr:last").find('td:first').html(++rowCount).end().fadeIn(500);
删除FadeOut：
$("table").on("click", ".remove_button", function() {
$(this).parents("tr").fadeOut(500, function(){
$(this).remove();
});
<强> Sample
答案 1 :(得分：0)
解决你的第二个问题
更新了js
$(document).ready(function($)
{
// trigger event when button is clicked
$("button.add").click(function()
{
// add new row to table using addTableRow function
addTableRow($("table"));
// prevent button redirecting to new page
return false;
});
// function to add a new row to a table by cloning the last row and
// incrementing the name and id values by 1 to make them unique
function addTableRow(table)
{
// clone the last row in the table
var $tr = $(table).find("tbody tr:last").clone();
// get the name attribute for the input and select fields
$tr.find("input,select").attr("name", function()
{
// break the field name and it's number into two parts
var parts = this.id.match(/(\D+)(\d+)$/);
// create a unique name for the new field by incrementing
// the number for the previous field by 1
return parts[1] + ++parts[2];
// repeat for id attributes
}).attr("id", function(){
var parts = this.id.match(/(\D+)(\d+)$/);
return parts[1] + ++parts[2];
});
// append the new row to the table
$(table).find("tbody tr:last").after($tr);
// remove rows
$(".remove_button").live("click", function() {
$(this).parents("tr").remove();
})
rowCount = 0;
$("#table tr td:first-child").each(function() {
rowCount++;
$(this).text(rowCount);
});
};
});
答案 2 :(得分：0)
淡入淡出动画相当容易。在将行添加到表中的行之后，添加以下代码：
$tr.hide().fadeIn('slow');
对于淡出，只需在动画结束后删除行，所以将它放在动画函数的回调中：
// remove rows
$(".remove_button").live("click", function() {
$(this).parents("tr").fadeOut('slow', function () { $(this).remove(); } );
});
最后，您的计数不正确，因为您为当前行添加了数字，然后克隆最后一行，因此将始终克隆最后一个数字。要解决此问题，您需要做的就是移动代码以进一步向下添加行号，在克隆和添加行的代码下方。您可能还想将相同的代码添加到fadeOut回调函数中，以便在删除行后重置计数。
答案 3 :(得分：0)
1）在addTableRow（）函数中放置此代码段：
$("#table tr td:first-child").each(function() {
rowCount++;
$(this).text(rowCount);
});
不是在开头，而是在函数体的末尾 - 因为你在这里计算现有元素并且新元素在函数的开头还没有 - 它是在稍后创建的，所以上面必须在最后完成。
答案 4 :(得分：0)
不改变您的代码格式...
1）淡入效果..你可以使用fadeIn（）（因为fadeIn效果只发生在隐藏元素上..先隐藏它然后使用fadeIn ...
$(table).find("tbody tr:last").after($tr).hide().fadeIn();
2）并且您的计数是这样的，因为您在点击添加后计算<tr><td>的计数...所以当附加文本时，首先只会有一个字段...所以移动代码到底，应该做什么
此
rowCount = 0;
$("#table tr td:first-child").each(function() {
rowCount++;
console.log(rowCount);
$(this).text(rowCount);
});
在结束之前：
$("table").on("click",".remove_button", function() {....
注意：{j弃读版{...}}已被弃用并在jquery 1.9中删除....所以请使用live()