如何使用javascript使用字符偏移量來設置和設置插入位置？

-1

有沒有一種方法可以使用javascript來獲取&使用字符偏移設置插入位置（相對於文檔的開始位置）？如何使用javascript使用字符偏移量來設置和設置插入位置？

在我的情況下，由於許多原因，首選值是字符偏移而不是dom節點。是否有相當快的速度（沒有明顯的時間）來實現這個目標？我寧願將任何'p'標籤視爲字符（'\ n'），但如果這使得解決方案變得不可能，忽略它們是可以的。

編輯：由於它顯然令人困惑，因爲有一個插入符號，所以我在詢問一個插入符號。不是因爲沒有。 [那些不瞭解contentEditable的人無論如何都沒有機會回答這個問題，所以我認爲沒有必要解釋]。由於我期望證明我嘗試過，但不知道我所問的問題的解決方案（爲什麼我會問，我想知道？），這是我已經能夠解決的最佳嘗試。它沒有給出正確的答案。

編輯：它現在給出正確答案;唯一的問題是如果有一些JavaScript方法或更簡單，更快的方法。

編輯：固定爲在換行結束後選擇結束時給出正確答案。

 function nodeOffset(findnode) { 
      var offset = 0; 
      var root = document.body 
      var node = root.childNodes[0]; 
      while(node != null) { 
       if(node.nodeType == 3) { 
        if(node == findnode) 
         return offset; 
        offset += node.length; //text 
       } else if (node.tagName == 'P') { 
        offset += 1; //newline character 
        if(node == findnode) 
         return offset; 
       } 
       if(node.hasChildNodes()) { 
        node = node.firstChild; 
       } else { 
        while(node.nextSibling == null && node != root) { 
         node = node.parentNode; 
        } 
       node = node.nextSibling; 
       } 
      } 
     } 

     var selection = window.getSelection(); 
     var offset = nodeOffset(selection.focusNode) + selection.focusOffset;

來源

2013-12-10 Jeff

Mmh的，光標通常不可見一個頁面（輸入元素之外）。那麼你究竟是什麼意思？ –

當使用contentEditable時，或者坦率地說，即使沒有，也做出選擇，那裏*是*插入符號（和錨點）。 – Jeff

確切地說，這就是爲什麼我要求更多上下文。 *「或坦率地說即使不是」*，也不適合我「。如果我點擊您帖子中的任何地方，我都看不到插入符號。光標當然會改變，如果你是這個意思，但是當你想要這個位置的時候會有問題。懸停在某個元素上時？ –

蠻力的方法。（它絆倒了，例如，如果其他標籤display:block或者p不display:block，或其他可能的問題的一個很好的機會）：

要獲得選擇尖/錨偏移，這可能是同一個：

 function nodeOffset(findnode) { 
      var offset = 0; 
      var root = document.body 
      var node = root.childNodes[0]; 
      while(node != null) { 
       if(node.nodeType == 3) { 
        if(node == findnode) 
         return offset; 
        offset += node.length; //text 
       } else if (node.tagName == 'P') { 
        offset += 1; //newline character 
        if(node == findnode) 
         return offset; 
       } 
       if(node.hasChildNodes()) { 
        node = node.firstChild; 
       } else { 
        while(node.nextSibling == null && node != root) { 
         node = node.parentNode; 
        } 
       node = node.nextSibling; 
       } 
      } 
     } 

     var selection = window.getSelection(); 
     var focusoffset = nodeOffset(selection.focusNode)+selection.focusOffset; 
     var anchoroffset = nodeOffset(selection.anchorNode)+selection.anchorOffset;

設置插入符/錨偏移，但他們必須是有序smallest->大，沒有選擇，其中要重點&這是錨：

 function offsetNode(findoffset) { 
      var offset = 0; 
      var root = document.body 
      var node = root.childNodes[0]; 
      while(node != null) { 
       if(node.nodeType == 3) { 
        offset += node.length; //text 
        if(offset >= findoffset) 
         return [node, findoffset-offset+node.length]; 
       } else if (node.tagName == 'P') { 
        offset += 1; //newline character 
       } 
       if(node.hasChildNodes()) { 
        node = node.firstChild; 
       } else { 
        while(node.nextSibling == null && node != root) { 
         node = node.parentNode; 
        } 
       node = node.nextSibling; 
       } 
      } 
     } 

     var selection = window.getSelection(); 
     var range = document.createRange(); 
     var start = offsetNode(startoffset) 
     var end = offsetNode(endoffset) 
     range.setStart(start[0], start[1]); 
     range.setEnd(end[0], end[1]); 
     selection.removeAllRanges(); 
     selection.addRange(range);

來源

2013-12-11 06:29:58 Jeff

如何使用javascript使用字符偏移量來設置和設置插入位置？

回答

相關問題