如何申请的slideToggle功能的jQuery insertAfter使用jQuery

我有动态行的表像如何申请的slideToggle功能的jQuery insertAfter使用jQuery

<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功能。我该怎么做？

来源

2014-06-11 Dot Net Developer

你使用的是什么版本的jQuery？ ['live（）']（http://api.jquery.com/live/）已被弃用（jQuery 1.7）并被删除（1.9）。 –

“var html”有很大的东西，我用它来显示样本。 –

1. line 5''应该是''2.首先''没有''标记 –

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：

来源

2014-06-11 11:06:51

没关系，我怎么能像滑动切换; –

slidetoggle按钮？ –

是的，我用insertAfter（）插入点击按钮旁边的按钮，但它应该隐藏并显示像幻灯片 –

入住这Working Fiddle

对于插入.parents()，

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

对于slideToggle()，

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

来源

2014-06-11 11:24:00

谢谢..！但幻灯片功能只需要应用按钮'btnInsert' –

好吧，现在问题似乎很清楚。等等，你想隐藏新的行还是删除？ –

更新** [小提琴]（http://jsfiddle.net/Saku7/3/）** –

如何申请的slideToggle功能的jQuery insertAfter使用jQuery

回答

相关问题