jQuery contentEditable 不起作用 - Internet Explorer 8 - 编辑表格项答案

【问题标题】：jQuery contentEditable not working - Internet Explorer 8 - edit table itemsjQuery contentEditable 不起作用 - Internet Explorer 8 - 编辑表格项
【发布时间】：2014-08-26 16:40:27
【问题描述】：

我需要让这段代码在 Internet Explorer 8 中运行：

http://jsfiddle.net/tYtQV/5/

$("tbody tr td").bind("click", onClick);

function onClick(e) {
    if(e.currentTarget.contentEditable != null)
    {
            $(e.currentTarget).attr("contentEditable",true);
    }
    else
    {
            $(e.currentTarget).append("<input type='text'>");
    }
}

它在 Firefox 或 Chrome 中运行良好，但在 IE8 中则不行。

我尝试将 bind() 更改为 live() 但这没有任何效果 - 当我单击列表项时它什么也不做（虽然调用了事件处理程序）

如果我将 contentEditable 更改为全小写的“contenteditable”，它会在每次单击元素时将文本形式附加到元素，这不是我想要的。

此代码的目的是使表格项可编辑。有关如何解决此问题的任何想法？

提前致谢！

【问题讨论】：

标签： javascript jquery html internet-explorer internet-explorer-8

【解决方案1】：

TD 元素不能设置为 contenteditable。查看此页面以供参考：http://msdn.microsoft.com/en-us/library/ms537837(v=vs.85).aspx

您可以在单元格中添加一个空 div，然后将其设为 contenteditable

【讨论】：

谢谢！我不知道那件事。使用另一个
它可以工作

【解决方案2】：

在 div 中添加 contenteditable 的唯一问题是占位符问题，因为该区域仅可编辑到该特定区域。如果您有占位符并删除占位符以写入更多内容，则会删除编辑功能，因此请务必处理好。

【讨论】：

【解决方案3】：

IE中有很多元素，不能直接设置contenteditable。但是，您可以将整个表格包装到一个内容可编辑的 div 中。

 <div contenteditable="true">
     <table>
       ...
    </table>
 </div>

【讨论】：