Question

我的表格包含动态行，例如

<table>
 for(int i=0;i<=Modal.Count;i++)
  {
    <tr class="trList">
    <td class="tdEmpid><input type="button" value="Insert row"  class="btnInsert"/></td>
    <td><input type="text" id="Sun_Hrs' + i + '"   value="' + data.GetTimeSheetDetails[i].SUN_HRS + '" style = "width:50px;border: 0px;background-color: white;text-align: left;" readonly="true"/></td>
    <td><input type="text" id="Mon_Hrs' + i + '"   value="' + data.GetTimeSheetDetails[i].MON_HRS + '" style = "width:50px;border: 0px;background-color: white;text-align: left;" readonly="true"/></td>
    <td><input type="text" id="Tue_Hrs' + i + '"   value="' + data.GetTimeSheetDetails[i].TUE_HRS + '" style = "width:50px;border: 0px;background-color: white;text-align: left;" readonly="true"/></td>;
        ..........
        ..........                                                                
    </tr>
   }

现在，我想将按钮动态地完全添加到下一行按钮的行，因为我已经编写了jquery代码

 $(document).ready(function(){
    $('.btnInsert').live('click',function(){
        var html = '<tr class="trNeedTimesheet"><td></td><td></td></td><td><p style="background-color:white;">--  Need To Enter TImesheetHours</b> -------</p></td></tr>';
        $("" + html + "").insertAfter($(this).parent('td.tdEmpId').parent('tr.trList')); 
    });
 });

它不仅是添加，而且应该像slidetoggle功能一样插入和工作。我怎样才能做到这一点？

Answer 1

parent()不接受参数，但parents()会这样做。

更改此行

$("" + html + "").insertAfter($(this).parent('td.tdEmpId').parent('tr.trList'));

到

$("" + html + "").insertAfter($(this).parents('tr.trList'));

<强> Demo

修改：更新了切换功能。

jQuery：

$(document).on('click','.btnInsert', function(){
    var $nextTr =  $(this).parents('tr.trList').next();
    var newTrExist =$nextTr.hasClass('newTr');
 if(newTrExist)
 {
   $nextTr.toggle();  
 }
 else
 {      
       var html = '<tr class="newTr trNeedTimesheet"><td></td><td></td></td><td><p style="background-color:white;">--  Need To Enter TImesheetHours</b> -------</p></td></tr>';
       $(html).insertAfter($(this).parents('tr.trList'));
 }

}）;

更新了Demo：

Answer 2

选中 Working Fiddle

对于插入 .parents() ，

$(html).insertAfter($(this).parents('tr.trList'));

slideToggle() ，

$(document).on('click','.trNeedTimesheet',function(){
   $('p',this).slideToggle()
});

如何将slideToggle功能应用于jquery insertAfter使用jquery

2 个答案: