jQuery克隆并将行添加到最后一行
每当用户单击new按钮时,我想添加一行。我想克隆行“tRow0”并将其添加到表“tblEquipment tbody”的最后一行。我编写了一个JavaScript函数来添加行(AddEquipment)。问题是该行没有添加到最后一行 克隆行:tRow0 最后一行:tRow1 实际上,新行必须添加在“tRow1”行之后。但是新行添加在“trActivity1_2”行下面。请提供解决方案 我的javascript函数: 函数附加设备() { } 我的aspx页面:jQuery克隆并将行添加到最后一行,jquery,Jquery,每当用户单击new按钮时,我想添加一行。我想克隆行“tRow0”并将其添加到表“tblEquipment tbody”的最后一行。我编写了一个JavaScript函数来添加行(AddEquipment)。问题是该行没有添加到最后一行 克隆行:tRow0 最后一行:tRow1 实际上,新行必须添加在“tRow1”行之后。但是新行添加在“trActivity1_2”行下面。请提供解决方案 我的javascript函数: 函数附加设备() { } 我的aspx页面: <table id="tbl
<table id="tblEquipment">
<thead>
<tr>
<th>
</th>
<th>
Equipment</th>
<th>
Hierarchy</th>
<th>
Remarks</th>
<th>
Attachment</th>
<th>
Total Cost</th>
</tr>
</thead>
<tbody id="tbEquipment">
<tr id="tRow0" class="trChildItem">
<td>
<input id="chkEqp0" name="chkEqp0" type="checkbox" />
</td>
<td>
<div id="divEqpName0">
<input id="hdnWODefEqpId0" name="hdnWODefEqpId0" type="hidden" value="0" />
<input id="hdnEquipmentId0" name="hdnEquipmentId0"
onpropertychange="AutoSaveEquipment(0);" type="hidden" value="0" />
<input id="txtEquipment0" class="clsSpText" name="txtEquipment0" readonly />
</div>
<div id="divEqpImage0">
</div>
</td>
<td>
<div id="divEqpHierarchy0">
</div>
</td>
<td>
<textarea id="txtEqRemarks0" class="clsSpTextArea" cols="20"
name="txtEqRemarks0" rows="1"></textarea>
</td>
<td>
</td>
</tr>
<tr id="tActMaster0" class="trInnerChildItem">
<td>
</td>
<td colspan="5">
<div id="divActivitiesdetails0">
</div>
</td>
</tr>
<tr id="tRow1" class="trChildItem">
<td>
<input id="chkEqp1" runat="server" type="checkbox" />
<div id="divEqpEdit1">
</div>
</td>
<td>
<div id="divEqpName1">
<input id="hdnWODefEqpId1" runat="server" type="hidden" value="7" />
<input id="hdnEquipmentId1" runat="server" type="hidden" value="4" />
<div id="divEqp1">
e2</div>
<div id="divEqpImage1">
<a id="activiy1" onclick="HideActivities(1)">
</div>
</td>
<td>
<div id="divEqpHierarchy1">
Equipment-->e2</div>
</td>
<td>
<div id="divEqpRemarks1">
Remarks</div>
</td>
<td>
<div>
</div>
</td>
<td>
<div>
$0.00</div>
</td>
</tr>
<tr id="tActMaster1" class="trInnerChildItem" jquery1275984958765="3">
<td>
</td>
<td colspan="5">
<div id="divActivitiesdetails1">
<div id="divActivityMaster">
<table>
<thead>
<tr>
<th>
<a onclick="ActivityPopUp(0,1)">
</a></th>
<th>
Activity</th>
<th>
Description</th>
<th>
Duration</th>
</tr>
</thead>
<tbody id="tbActivity">
<tr id="trActivity1_1" class="trChildItem" ondblclick="ActivityPopUp(3,1)"
onmouseleave="HideActEditDiv('1_1')" onmouseover="ShowActEditDiv('1_1',7,1)">
<td>
<div id="divActEdit1_1">
</div>
</td>
<td>
<input id="hdnDefActivityId1_1" runat="server" type="hidden" value="33333" />
<div id="divActivityName1_1">
Act1</div>
</td>
<td>
<div id="divActivityDesc1_1">
Ac1</div>
</td>
<td>
<div id="divActivityDuration1_1">
1 Day</div>
</td>
</tr>
<tr id="trActivity1_2" class="trChildItem" ondblclick="ActivityPopUp(3,1)"
onmouseleave="HideActEditDiv('1_2')" onmouseover="ShowActEditDiv('1_2',7,1)">
<td>
<div id="divActEdit1_2">
</div>
</td>
<td>
<input id="hdnDefActivityId1_2" runat="server" type="hidden" value="4" />
<div id="divActivityName1_2">
Act2</div>
</td>
<td>
<div id="divActivityDesc1_2">
Act2Desc</div>
</td>
<td>
<div id="divActivityDuration1_2">
1 Day</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</tbody>
</table>
装备
等级制度
评论
附件
总成本
e2
设备——e2
评论
$0.00
活动
描述
期间
行动1
Ac1
一天
行动2
Act2Desc
一天
我认为jQuery.append是您需要的:有一个示例显示了如何在页面上选择一个元素,并在最后将其插入到另一个元素中。我编写了一个jQuery插件,可以让您这样做。您可以添加和删除行(使用动画),而不需要使用div或类似的东西包装数据。查看 最好的
Fletch下面的代码将克隆表中最后一行并添加到最后一行之后:
var $tableBody = $('#tbl').find("tbody"),
$trLast = $tableBody.find("tr:last"),
$trNew = $trLast.clone();
$trLast.after($trNew);
工作示例:小懒人方式:
$('#table tbody tr:last').clone().insertAfter('#table tbody tr:last');
Fletch已经有4年没有出现在SO上了,所以这个答案不会很快更新。
$('#table tbody tr:last').clone().insertAfter('#table tbody tr:last');