Javascript 当单击“更改为文本区域”时，当在外部单击“更改回”

我试图创建一个类似PHPadmin的函数，当显示表格时，当单击div字段时，将其更改为文本区域，当单击div外部时，将其更改回div字段。下面的代码是错误的，当我点击外部时，我不能更改回div文件。请帮我改进代码

JS:

$（“#编辑器#网格编辑”）.bind({
单击：函数（）{
$（this.html（“”+$（this.text（）+“”）；
},
模糊：函数（）{
$（this.html（“”+$（this.text（）+“”）；
}
});

Html:

哈罗世界
哈罗世界2
哈罗世界3

---

我只有8个名声，我不能投你的票。然而，我真诚地感谢你的帮助

当您第一次单击

#网格编辑时

它是一个div，因此

此

是一个div，您可以替换它的内容来更改内容。然而，当你模糊了

#gird#u edit

是一个文本区域，因此如果你改变了它的内容，你并没有真正改变你想要改变的内容（你只是改变了文本区域的内部）

您要更改的是文本区域周围的div，即该文本区域的“父级”。换句话说，尝试：

blur: function() {
        $(this).parent().html('<div id="gird_edit">'+$(this).text()+'</div>');
}

blur:function（）{
$（this.parent（）.html（“”+$（this.text（）+“”）；
}

当您第一次单击

网格编辑时，它是一个div，因此
此
是一个div，您可以替换它的内容来更改内容。然而，当你模糊了
#gird#u edit
是一个文本区域，因此如果你改变了它的内容，你并没有真正改变你想要改变的内容（你只是改变了文本区域的内部）

您要更改的是文本区域周围的div，即该文本区域的“父级”。换句话说，尝试：

blur: function() {
        $(this).parent().html('<div id="gird_edit">'+$(this).text()+'</div>');
}

blur:function（）{
$（this.parent（）.html（“”+$（this.text（）+“”）；
}
检查我刚做的jsbin，如果你需要我乐意帮助的任何东西。
检查我刚做的jsbin，如果你需要我乐意帮助的任何东西。


当
$（this）.html（textarea）
完成时，
div
已经模糊。所以onBlur不起作用了

$('#editor #gird_edit').bind({
    click: function() {
        var tex = $(this).text();
        var textarea = $('<textarea id="gird_edit">'+tex+'</textarea>');
        $(this).html(textarea);
        textarea.focus();
        textarea.blur(function(){
            var currentText = textarea.val();
            if(currentText == tex)//not change
                textarea.parent().text(tex);
            else //changed
                alert(currentText);
        });
    }
});

查找更多信息


当
$（this）.html（textarea）
完成时，
div
已经模糊。所以onBlur不起作用了

$('#editor #gird_edit').bind({
    click: function() {
        var tex = $(this).text();
        var textarea = $('<textarea id="gird_edit">'+tex+'</textarea>');
        $(this).html(textarea);
        textarea.focus();
        textarea.blur(function(){
            var currentText = textarea.val();
            if(currentText == tex)//not change
                textarea.parent().text(tex);
            else //changed
                alert(currentText);
        });
    }
});

查找更多信息
非常感谢！真诚的，当然，没问题，我们是来帮忙的，节日快乐！ups，是的，很抱歉，如果（按下.is（“textarea”））返回，就抛出这行；紧接着按下var=$（e.target）；更新的版本非常感谢你。是否可以仅通过一个id确定事件？就像我有相同的div id='gird\u edit'一样，可能有多个id相同的标记，但这被认为是一种不好的做法，应该用同一个类处理多个元素，因此每个元素的id都是唯一的。@Teifi表给出的答案确实是一流的，它使用一个id来表示多个标记。干杯，非常感谢！真诚的，当然，没问题，我们是来帮忙的，节日快乐！ups，是的，很抱歉，如果（按下.is（“textarea”））返回，就抛出这行；紧接着按下var=$（e.target）；更新的版本非常感谢你。是否可以仅通过一个id确定事件？就像我有相同的div id='gird\u edit'一样，可能有多个id相同的标记，但这被认为是一种不好的做法，应该用同一个类处理多个元素，因此每个元素的id都是唯一的。@Teifi表给出的答案确实是一流的，它使用一个id来表示多个标记。干杯。问题是，模糊函数不会响应单击函数生成的文本区域。问题是，模糊函数不会响应单击函数生成的文本区域。更改文本区域内的值后，单击外侧。该字段将变回原始值。我该如何重读价值观？非常感谢，这部作品完美无瑕！只需一个矿工问题，无论您单击何处，编辑器光标都将自动返回开始位置，这是否可能被修复？更改文本区域内的值后，单击外侧。该字段将变回原始值。我该如何重读价值观？非常感谢，这部作品完美无瑕！只要一个矿工的问题，编辑器光标将自动返回到开始，无论你点击，这是可能的修复？
else{
    textarea.parent().text(currentText);
    //something else
}