Skip to content

Tag: contenteditable

How to recreate google keep note

I tried to create my own notes for the school project. And I ran into some problems, I am using contentEditable for the note-taking part and it auto-generates divs. I tried to remove them with not much luck. Html JavaScript In this code, you have to press space twice but the bigger problem is when you try to create a

Focusing on nested contenteditable element

So, I have two contenteditable divs nested inside of another: Here is Fiddle. When it is focused, nested should be focused but using console.log(document.activeElement); it shows that the top is focused and it doesn’t recognize the nested div. In a case where content is being edited, I need to recognize nested div element instead of the top element. How would

React.js: onChange event for contentEditable

How do I listen to change events for a contentEditable-based control? Code on JSFiddle. Answer See Sebastien Lorber’s answer which fixes a bug in my implementation. Use the onInput event, and optionally onBlur as a fallback. You might want to save the previous contents to prevent sending extra events. I’d personally have this as my render function. jsbin Which uses