CODEWITHSUNDEEP
javascripthighlighttext-editorword-processor
Roy Hoffman
Roy Hoffman

Reputation: 1

How to highlight selected text in a rich text editor when the selection spans multiple HTML tags?

I'm implementing text highlighting functionality in a custom text editor using vanilla javascript, similar to how MS Word highlights text. The issue I'm encountering is that when a user selects text that spans multiple HTML tags, the selection is not accessible in a way that allows me to highlight it properly.

Here’s an example of how the text is structured in my editor:

<p>I never [mouse down] found out who sent me the flowers.</p>
<p>It was my first flight. I was <b>nervous</b> as the plane took off.
  <span class='highlight'>I tried many times to[mouse up] contact her. In the end I gave up.</span>
</p>

In this case, the user would select the text starting from "I never" (indicated by [mouse down]) to "contact her" (indicated by [mouse up]), and I want to apply a highlight to the selected portion of text.

What I need help with: How can I implement a solution that allows me to highlight text that is selected across multiple tags?

I can't find out the solution for this problem.

Upvotes: 0

Views: 38

Answers (0)

Related Questions