0

Given the following arbitary string:

"This is page one, This is page two, and this is page two, and this is page three."

I am highlighting (dragging my cursor over the text and selecting) a random sub-string; for this example I am highlighting the second occurrence of the term "page two".

I get this highlighted text using:

var text = window.getSelection().toString();

I now need to determine what the start and end index of the highlighted term within the text.

The string and highlighted term is arbitrary - there is no pattern to selection.

  • 1
    And if your text were `"This is page one, and this is page two, and this is page three."` - what would your expected outcome be? – connexo Feb 23 '19 at 14:54
  • The second occurrence (the highlighted text). Wasn't sure if I should add that to the example - will do so now. –  Feb 23 '19 at 14:55
  • How is the word highlighted? Does the string have html tags in it? Are you really just asking how to find a word in a string that is wrapped in a tag? – Charlie Wallace Feb 23 '19 at 15:01
  • Why the second? Is there any pattern? – Jonas Wilms Feb 23 '19 at 15:04
  • There is no pattern, it is just the text that I randomly chose to highlight. For example, I could have highlighted the third occurrence of the word `"and"` –  Feb 23 '19 at 15:05
  • 1
    To get a good answer you will have to describe how the word is highlighted? If it is html tags there are many good answers already on stackoverflow.. look at https://stackoverflow.com/questions/2818547/the-best-way-to-parse-html-tags-in-java-script and https://johnresig.com/blog/pure-javascript-html-parser/ – Charlie Wallace Feb 23 '19 at 15:07
  • Highlighted in terms of selecting the text with my mouse. –  Feb 23 '19 at 15:09
  • It took me a while to realize that the **highlighted** word is actually **highlighted** in the given input. From the answers it seems I were not the only one ... – Jonas Wilms Feb 23 '19 at 15:26
  • 1
    If you look at tge dupe you'll find `activeEl.selectionStart` and `selectionEnd` – Jonas Wilms Feb 23 '19 at 15:33
  • Thanks @JonasWilms - although I am aiming to do this without using a text area. –  Feb 23 '19 at 15:59

1 Answers1

0

This will get you the start and end index of the cursor selected text.

 //To get start index
window.getSelection().anchorOffset
// To get end index
window.getSelection().focusOffset
Krishnadas PC
  • 5,981
  • 2
  • 53
  • 54
  • Please see the updated example. It needs to get the index of the highlighted text in an arbitrary string. It won't always be the first or last occurrence. –  Feb 23 '19 at 15:01
  • That was made before the edit. Now the code has been changed. Let me know if this is what is needed. – Krishnadas PC Feb 23 '19 at 15:21
  • Same issue as the above answers unfortunately, we won't know what the position of the selected word is (it could be the first or the hundredth) but we only want to get the indexes of the selected word, not all of them. –  Feb 23 '19 at 15:25
  • Please check if this is what you are expecting. – Krishnadas PC Feb 23 '19 at 15:47
  • That doesn't get the index , just the length of the word from what I can tell. –  Feb 23 '19 at 15:54
  • `"This is page one, This is page two, and this is page two, and this is page three."` If the second `page` is cursor selected what is the answer you are expecting? – Krishnadas PC Feb 23 '19 at 15:56
  • startIndex = 26, endIndex = 29 The `.selectionStart` and `.selectionEnd` method mentioned in the comments above works, but I'm trying to find a work around without having to use a text area. –  Feb 23 '19 at 15:57