c# - Javascript getElementbyId 工作一次但不能工作两次？

Question

我正在尝试获取一个表格单元格，当我们单击它时，它可以变成文本框，以便我们可以填充它，然后将文本添加到单元格中。

这是我的 JavaScript 函数:

$(".cellConsigne").click(function () {
    var numId = this.id.substring(24);
    document.getElementById("MainContent_txtConsigne" + numId).style.display = "block";
    document.getElementById("MainContent_txtConsigne" + numId).focus();
});

$(".txtTab").focusout(function () {
    var numId = this.id.substring(23);
    document.getElementById("MainContent_cellConsigne" + numId).textContent = this.value;
    this.style.display = "none";
});

以及我在后面的 C# 代码中对单元格和文本框的声明:

TableCell cell17 = new TableCell();
cell17.ID = "cellConsigne" + i.ToString();
cell17.CssClass = "cellConsigne";

TextBox txtConsignes = new TextBox();
txtConsignes.ID = "txtConsigne" + i.ToString();
txtConsignes.CssClass = "txtTab";
txtConsignes.BackColor = row.BackColor;

cell17.Controls.Add(txtConsignes);

所以问题是第一次工作正常，我单击，文本框显示并获得焦点。我将文本放入其中，然后离开文本框，文本转到单元格中。但是，当我第二次单击该单元格时，我在 document.getElementById("MainContent_cellConsigne"+ numId) 上收到“引用空错误”。

问题可能出在 CSS 类上，还是出在样式的修改上？我真的不知道。

Answer 1

我发现问题了!

当我这样做时

document.getElementById("MainContent_cellConsigne" + numId).textContent = this.value;

它清空单元格内的控件，然后将文本添加到单元格中。所以文本框不再位于单元格中。

我只是在单元格中添加一个标签，并将文本框中的文本添加到标签中，这样就不再清空单元格了。