quiero hacer clic en la palabra y ¿por qué trabajar con párrafo y no con textArea de html?
document.getElementById("wordcount").addEventListener('click', (e) => { s = window.getSelection(); var range = s.getRangeAt(0); var node = s.anchorNode; while (range.toString().indexOf(' ') != 0) { range.setStart(node, (range.startOffset - 1)); } range.setStart(node, range.startOffset + 1); do { range.setEnd(node, range.endOffset + 1); } while (range.toString().indexOf(' ') == -1 && range.toString().trim() != ''); var str = range.toString().trim(); alert(str); }); <textArea id="wordcount" class="clickable"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris rutrum ante nunc. </textArea> aquí funciona con <p> pero quiero usar con textArea
Detectar en qué palabra se ha hecho clic dentro de un texto ¿Cuál es el problema?
Pruebe esta solución:
<textarea id="wordcount" class="clickable"> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris rutrum ante nunc. </textarea> <script> const textarea = document.getElementById('wordcount'); const grabWord = (start, val) => { let arr = val.split(' '); let sum = 0; for (let index in arr) { sum += arr[index].length + 1; if (sum > start) return arr[index]; } }; const getClickedWord = (e) => { let start = e.currentTarget.selectionStart; console.log(grabWord(start, textarea.value)); }; textarea.addEventListener('click', getClickedWord); </script>