且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

使用javascript或jquery向网格视图添加新行

更新时间:2023-10-19 18:13:16

客户端没有网格视图,只有一张桌子。因此,创建一个新的tr / td /任意HTML字符串并将其附加到表中。
There is no grid view on the client side, only a table. So create a new tr/td/whatever string of HTML and append it to the table.


<!-- There is no grid view on the client side, only a table. So create a new tr/td/whatever string of HTML and append it to the table. try this... -->

<html>
<head>
<script type="text/javascript">
        function addRow()
        {
            var tr = document.createElement("tr");

            for(var c = 0; c < tbl.rows[0].childNodes.length; c++)

            {

                var td = document.createElement("td");

                td.innerText = "Column " + c;

                tr.appendChild(td);



                tr.style.backgroundColor = "lightgrey";

                td.onmouseover = function()

                {

                    this.style.backgroundColor = "lightyellow";

                }

                td.onmouseout = function()

                {

                    this.style.backgroundColor = "lightgrey";

                }

                td.onclick = function()

                {

                    alert(this.innerText);

                }

            }



            tbl.children[0].appendChild(tr);

        }

</script>
</head>
<body>
      <table id="tbl" width="60%" border="1">
             <tr>
                 <td>1</td>
                 <td>2</td>
                 <td>3</td>
                 <td>4</td>
                 <td>5</td>
             </tr>
      </table>
      <br/><br/>
      <input type="button" onclick="addRow();" value="Add Row" />
</body>
</html>