zoukankan      html  css  js  c++  java
  • js在table指定tr行添加tr行

    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'>"+ '&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp'+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>  

  • 相关阅读:
    C# 托管内存与非托管内存之间的转换
    A*算法详解链接
    【转】使用minizip解压缩多个文件(基于zlib)
    lua中table的遍历,以及删除
    clientHeight scrollHeight offsetHeight
    消息中间件(转)
    js 原型链和继承(转)
    session 和 cookie (转)
    java servlet
    redis 命令
  • 原文地址:https://www.cnblogs.com/wangle2014/p/3758391.html
Copyright © 2011-2022 走看看