contentEditable by class = false不起作用

问题描述

我有一个按钮，当单击该按钮时会调用一个函数，该函数使具有类的所有项目都可编辑。效果很好。我遇到的问题是，我需要删除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]

解决方法

这对您有用吗？

来源：源代码来自您问题中的参考文献。

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>

contenteditable dom javascript