I created a html table and set the td
elements to contenteditable = true
. If I click somewhere else on the page I "end" the editing of the content which means the cell isn't highlighted anymore and typing characters doesn't add them to the cell.
I want to achieve this on pressing the return key. I already have a key listener to prevent the user from inserting line breaks when pressing the return key:
document.addEventListener('keydown', function (event) {
if (event.key === 'Enter') {
event.preventDefault();
var value = event.target.innerHTML;
// do something with the value
}
});
How do I "end" editing (something like jump out of the cell) on pressing the return key?
The td
elements all look like this:
<td class="memory-cell" id="memory-cell-45" data-cell-number="45" width="100" contenteditable="true">0</td>
UPDATE: I ended up on setting contenteditable = true
on click and removing the contenteditable
attribute on return key press.