獲取在文本框中單擊詞的位置（Javascript）

Question

我有一個帶有多個句子的文本框，當我單擊某個單詞時，我需要獲取該文本框中單詞的位置。

該代碼實際上只是從textarea獲取整個文本並將其寫入另一個文本區域。我正在努力獲得我點擊的角色（或單詞）的具體位置。

它應該做的是複製文本之前單擊文字/字符。

\t var themaintextarea = document.getElementById('textarea'); 
 
\t themaintextarea.addEventListener('click', replace_sentence); 
 
\t function replace_sentence(e){ 
 
\t \t var themaintext = document.getElementById("textarea").innerHTML; 
 
    //alert(thereplace); 
 
    document.getElementById("curent_sentence").value = themaintext; 
 
    theselection = window.getSelection(); 
 
    var therange = theselection.getRangeAt(0); 
 
    var sometext = therange.toString().trim(); 
 
    alert(sometext); 
 
    
 
\t } \t

<textarea id="curent_sentence"></textarea> 
 

 
<div id="textarea" contenteditable>I <span>like</span> apples. I <span>like</span> apples. 
 
<br> 
 
I <span>like</span> apples.</div>

Answer 1

編輯：繼承人的小提琴選擇的單詞的單詞單擊前。注意：這裏沒有使用跨度。 https://jsfiddle.net/Lnkav5ca/5/

我想我明白你在找什麼。 https://jsfiddle.net/Lnkav5ca/1/我將所有可點擊的單詞放在一個類中，並將事件偵聽器添加到該類中。所以當單擊它時被插入到文本框中。

var themaintextarea = document.getElementsByClassName('clickable'); 
for (var i = 0; i < themaintextarea.length; i++) { 
themaintextarea[i].addEventListener('click', replace_sentence); 
} 
function replace_sentence(e){ 
console.log(e); 
    var themaintext = e.target.innerHTML 
//alert(thereplace); 
document.getElementById("curent_sentence").value = themaintext; 
theselection = window.getSelection(); 
var therange = theselection.getRangeAt(0); 
var sometext = therange.toString().trim(); 
//alert(sometext); 

}