contentEditable by class = false 不起作用

Question

我有一个按钮，单击该按钮会调用一个函数，使所有具有类的项目都可编辑。它工作得很好。我遇到的问题是，我需要删除 contentEditable="true" 或将其设置为 false，因为当用户完成编辑时，页面会被导出。

启用编辑的代码（有效）

function editMode(){
    document.querySelectorAll('.edit').forEach(function(element){
        element.contentEditable = 'true';
    })
}

无法按预期工作的代码：

function editOff(){
    document.querySelectorAll('.edit').forEach(function(element){
        element.contentEditable = 'false';
    })
}

具有“edit”类的元素继续可编辑。当函数editOff 被调用时，它们应该不再是可编辑的了。

参考上述脚本：Javascript contentEditable of certain classes only [closed]

Answer 1

这对你有用吗？

来源：源代码来自您问题中的参考资料。

function editMode(){
    document.querySelectorAll('.edit').forEach(function(element){
        element.contentEditable = 'true';
    })
}

function editOff(){
    document.querySelectorAll('.edit').forEach(function(element){
        element.contentEditable = 'false';
    })
}

<p class="edit">
abcdefghijklmnop
</p>

<button onclick="editMode()">
Click to edit
</button>

<button onclick="editOff()">
Click to stop edit
</button>