0

whenever i add this function to underline a specific word("boy") my word processor write from right to left why?

const contentDiv = document.getElementById("content");

contentDiv.addEventListener("input", () => { 
    const text = contentDiv.textContent; 
    const formattedText = text.replace(/\bboy\b/g, 'boy'); 
    contentDiv.innerHTML = formattedText; 
});
<div id="content" contenteditable="true" spellcheck="false"></div>
DarkBee
  • 16,592
  • 6
  • 46
  • 58
Ayush Nobeen
  • 13
  • 2
  • 1
    Not sure what you mean by "write from right to left". The behavior I am observing is that the cursor position simply gets set to the very start, after `contentDiv.innerHTML = formattedText;` executed, which is to be expected. – CBroe Jul 07 '23 at 07:45
  • What debugging have you tried? Take out the replace and you will find the same behavior. As @CBroe has pointed out, it's the act of rewriting the innerHTML that puts the cursor back to the beginning, so the next time you input a character it's ahead of all the others. – A Haworth Jul 07 '23 at 07:55

0 Answers0