-1

JavaScript を使用してテーブルに新しい列を追加したいと考えています。

ここで、この追加が行われる追加インデックス位置に空の列を表示したいと思います。また、列の追加がそのインデックス位置で行われる場合は非表示にする必要があります。

メソッドコード:

function addColumn(tblId, colIndexVal)
  {

//New Header 

    var tblHeadObj = document.getElementById(tblId).tHead;

for (var h=0; h<tblHeadObj.rows.length; h++) {
      var newTH = document.createElement('th');

   tblHeadObj.rows[h].insertBefore(newTH, tblHeadObj.rows[h].children[colIndexVal] );

       newTH.innerHTML = "New Col Header";
    }

//New Column cells

    var tblBodyObj = document.getElementById(tblId).tBodies[0];
    for (var i=0; i<tblBodyObj.rows.length; i++) {
      var newCell = tblBodyObj.rows[i].insertCell(colIndexVal);
      newCell.innerHTML = 'new cells'
  )
    }


  }

誰でもこれを行う方法を提案できますか。ありがとう

4

3 に答える 3

0

基本的に、 eq を使用してインデックスを取得し、新しく作成されたインデックスの前に新しい行 (および場合によってはヘッダー) を挿入します。

このようなもの：

var table = $("table") // select your table,
    index = 3, // index where to insert
    newRow = $("<td></td>");
table.find("th").eq(index).before(newRow)

完全な例 (ヘッダー値も追加): http://jsfiddle.net/cTNqX/

于 2013-06-03T15:17:35.783 に答える
0

jsFiddle の例

td各行に要素を挿入することで、テーブルに新しい列を追加できます。

function addCol()
{
    $("table thead tr").each(function() {
        var td = $("<th>");
        var index = $(this).find("th").length;
        td.html("Col index " + index);
        td.appendTo(this);
    });

    $("table tbody tr").each(function() {
        var td = $("<td>");
        td.appendTo(this);
    });
}

addCol();
addCol();
于 2013-06-03T14:28:59.890 に答える