使用Jquery创建动态表

时间:2014-01-21 06:02:21

标签: jquery html-table

我正在使用Jquery创建一个动态表,我有动态的行数和列数。我想在所有行的FIRST列中打印一些文本,但在其余列中打印一些其他控件。如果该行是第一列,我应该如何找到它?

修改
实际上我正在尝试在创建表格的同时编写我的文本。我想我应该先用空行和列创建我的表,然后放入文本?

2 个答案:

答案 0 :(得分:2)

试试这个

$("#someTable tr").each(function(){
   $(this).find("td:first").text("some value");
});

但需要注意的是:我通常不鼓励人们在JavaScript / JQuery中创建动态html结构。我发现使用一些基于模板的数据绑定解决方案(如KnockoutJS或类似方法)更加清晰:http://knockoutjs.com/

答案 1 :(得分:1)

考虑您有一个div,其ID为canvs

您的脚本页

function create_table_element(rows,cols){

    var rand_id = makeid();
    var node1 = document.createElement("div");      
    node1.setAttribute('id', rand_id);
    document.getElementById("canvas").appendChild(node1);
    row=parseInt(rows);
    col=parseInt(cols);
    var tblid=makeid();
    var inner="<table id='"+tblid+"' class='draggable drsElement new_table_insert foreditor' border='1'></table>";
    $(inner).appendTo(node1);
    var table=document.getElementById(tblid);
    var num=row*col;
    for(var i=0;i<row;i++)
    {
    var row1=table.insertRow(0);
        for(var j=0;j<col;j++)
        {
        var cell1=row1.insertCell(0);
        cell1.innerHTML="new column  &nbsp;"+num;
        num--;
        }
    }

} 

和您的HTML页面

<html>
  <head>
    <script>
      create_table_element(10,5);
    </script>
  </head>
  <body>
    <div id='canvas'>
   </div>
  </body>
</html>