Question

我有一个editRow函数，它应该启用文本框而不是之前的单元格innerHTML中的文本。我需要更新单元格innerHTML，以便代替文本，它应该是一个文本框，里面有文本。我尝试了这个，但没有做到这一点：

function edit(index)
{   
    var currentRow=document.getElementById("row-"+index);
    var textBox=document.createElement('input');
    textBox.type= "text";
    textBox.id= "text-box"+(index);
    textBox.innerHTML= currentRow.cells[0].innerHTML;
    currentRow.cells[0].innerHTML = textBox ; 
}

我需要像appenChild这样的东西，但是替换旧的内容而不是附加到它。

Answer 1

为value而不是input设置innerHTML，并在追加td之前清除input：

function edit(index) {   
    var currentRow=document.getElementById("row-"+index);
    var textBox=document.createElement('input');
    textBox.type= "text";
    textBox.id= "text-box"+(index);
    textBox.value= currentRow.cells[0].innerHTML; // set input value
    currentRow.cells[0].innerHTML = null; // delete previous innerHTML
    currentRow.cells[0].appendChild(textBox) // add child
}

edit(1)

<table>
  <tbody>
    <tr id="row-1"><td>Hello</td></tr>
  </tbody>
</table>

如何更改表格单元格的

1 个答案: