2009年12月13日 星期日

在JavaScript 裡, 動態產生TD

function insert_specification_row(specification_row)
{
var idx = specification_row.rowIndex;
var specification_table = specification_row.parentNode;
var newrow = specification_table.insertRow(idx + 1);
var upload_id = --new_specification_count;

var cell = document.createElement("th");   //建立一個th
var cellText = document.createTextNode("商品規格"); //建立一個 text
cell.appendChild(cellText);       //將text附加到th上
newrow.appendChild(cell);       //將th附加上row上

var newcell = newrow.insertCell(-1);    //在該列的最後插入一個 td
newcell.innerHTML = '<input name="goods_specifications[]" type="text" size=60/> '+
'<img src="./modules/ec_goods_manage/admin/image/add.png" onclick="insert_specification_row(this.parentNode.parentNode)"> '+
'<img src="./modules/ec_goods_manage/admin/image/del.png" onclick="delete_specification_row(this.parentNode.parentNode)">';

var attr = document.createAttribute('colspan');
attr.value = '3';
newcell.setAttributeNode(attr);
// 若要在 newcell 加上 style 屬性,有兩種作法(第1種作法在IE6會掛掉):
// 1.
// attr = document.createAttribute('style'); //建立style屬性
// attr.value = 'width:95%;text-align:center;'; // 寫入屬性值
// newcell.setAttributeNode(attr); //將屬性設定給 newcell
// 2.
// newcell.style.width='95%'; //直接設屬性給 newcell
// newcell.style.textAlign='center'; //直接設屬性給 newcell
}