如何在Javascript中找到選擇div的文本開始和結束位置？

Question

這個問題可能類似於

How to find the selection text beginning and end positions in Javascript?

但它是一個有點不同。

我有這樣一個div這個 -

<div class="text-block title"> 
    ve <i><u>ri</u> <b>t</i>us</b> anything anything hi hello bla bla 
</div> 

如果用戶然後，我想要得到的指數選擇這個文本像這 -

我所試圖做的是所選文字的起始和結尾（此條件下的4,17）。

有什麼辦法嗎？

預先感謝幫助..

Answer 1

有一種方法，但首先添加一個「身份證」到文本請：

<div class="text-block title" id="text"> 
    ve <i><u>ri</u> <b>t</i>us</b> anything anything hi hello bla bla 
</div> 



$("#text").select(function(){  
    selectedText = document.getSelection(); 
    var index = getIndex(selectedText , this.innerHTML); 
    console.log("index: "+index.start+" , "+index.end; 
}); 

//this function was writed by me, so... 
var getIndex = function(wA ,wB){ 
    var a = wA.length; 
    var b = wB.length; 
    var d = b-a; 
    var that ={}; 
    if(a<=b){ 
     for(var i=0;i<=d;i++){ 
      var c = ""; 
      for(var j=0;j<wA.length;j++){ 
       c+=wB.charAt(j+i); 
      } 
      if(wA.toUpperCase()==c.toUpperCase()){ 
       that.start = i; 
       that.end = i+j; 
       return that; 
      } 
     } 
    } 
} 

並且那一切，檢查和嘗試，如果u發現錯誤告訴我，謝謝;）

Answer 2

它可以做得更簡單！ :)

$("textarea").select(function(e) { 
 
\t console.log(e.target.selectionStart); 
 
    console.log(e.target.selectionEnd); 
 
}); 
 

 
//fiddle: https://jsfiddle.net/Jorrex/upsopjqw/

textarea { 
 
    height: 200px; 
 
    width: 200px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea> 
 
    Hi Hello Vi Veritas Vanitas Sora Roxas Rike Kairi Mickey Donald Goofy Ventus Aqua Terra Eraqus Xehanort 
 
    
 
</textarea>