How to change div contenteditable from true to false
To do it on each elements with "contenteditable=true" you can simple try this:
var editableElements = document.querySelectorAll("[contenteditable=true]");
for (var i = 0; i < editableElements.length; ++i) {
editableElements[i].setAttribute("contentEditable", false);
}
Since you have 5 elements with contenteditable
, try giving them IDs to simplify access.
The following code deactivates the 5 contentediable
elements:
var editable_elements = document.querySelectorAll("[contenteditable=true]");
editable_elements[0].setAttribute("contenteditable", false);
editable_elements[1].setAttribute("contenteditable", false);
editable_elements[2].setAttribute("contenteditable", false);
editable_elements[3].setAttribute("contenteditable", false);
editable_elements[4].setAttribute("contenteditable", false);
Demo
Or you can you a loop
var editable_elements = document.querySelectorAll("[contenteditable=true]");
for(var i=0; i<editable_elements.length; i++)
editable_elements[i].setAttribute("contenteditable", false);
Even though you not tagged this question as jquery, you already asked if there is a way to do it. and my way to do it is using jquery.
Here's the FIDDLE
$('div').blur(function () {
$(this).attr('contenteditable', false);
});
or after saving the div content to db. use this code below to edit all div with contenteditable attribute true to false.
Heres' the FIDDLE
$('div[contenteditable="true"]').attr('contenteditable', false);