Question

我有一个HTML表格。我使用Javascript使这个表格可编辑。当用户单击一个单元格时，它将变为可编辑状态。这里的问题是，当单元格已经可编辑时，如果用户再次单击单元格....，则会出现一些标记和其他内容。每次点击都会显示新的文本框。

如何防止这种情况？

我使用以下Javascript代码。

function changeContent(tablecell)
{
    //alert(tablecell.firstChild.nodeValue);
    tablecell.innerHTML = "<INPUT type=text size=\"6\" name=newname onBlur=\"javascript:submitNewName(this);\" value=\""+tablecell.innerHTML+"\">";
    tablecell.firstChild.focus();
}
function submitNewName(textfield)
{
    //alert(textfield.value);
    textfield.parentNode.innerHTML= textfield.value;
}

Answer 1

如果每次点击后出现新的文本框，则代码不会处理这种情况：如果单元格已经有输入文本框，那么当用户点击时不要继续为输入文本框输入其他HTML在细胞上。

防止这种情况的一种方法是将表格单元格的类设置为类名，例如在changeContent函数末尾的“editable”。然后，如果tablecell.className不是“可编辑的”，那么您可以在同一个函数中使用代码，该函数只会放入输入文本框的HTML中。

请记住，在您的submitNewName函数中，还要在用户完成编辑后删除单元格的“可编辑”类名。