1.Ajax动态添加数据始终在table的首行
ajax:
$.post("servlet/TuCaoServlet",
{
tucaoComment: $("#tucaoComment").val() ,
method : 'addTcComment',
}, function(data){
$.each(data,function(index,tucao){
$("#txt :first").before( "<tr><td align='right' width='33%''><b>" + tucao.Title + "</b></td><td align='left'>"+ '       '+tucao.Description+" </td></tr><tr><td colspan='2'><hr></td></tr>");
});
} ,"json" );
html
<table width="100%" style="word-break:break-all;word-wrap:break-word">
<tbody id="txt">
</tbody>
</table>
2.js在table指定tr行添加tr行
javascript:
function onAddTR(trIndex)
{
var tb = document.getElementById("tb1");
var newTr = tb.insertRow(trIndex);//添加新行,trIndex就是要添加的位置
var newTd1 = newTr.insertCell();
newTd1.innerHTML = "这是新行,位置:" + trIndex;
var newTd2 = newTr.insertCell();
newTd2.innerHTML = "这是新行,位置:" + trIndex;
}
html:
<table style=" 100%;" id="tb1">
<tr onclick="onAddTR(this)">
<td>1</td>
<td>2</td>
</tr>
<tr onclick="onAddTR(this)">
<td>3</td>
<td>4</td>
</tr>
</table>
<script type="text/javascript">
function onAddTR(trObj)
{
$(trObj).after("<tr onclick='onAddTR(this)'><td>这是新行</td><td></td><tr/>");
}
</script>