在contenteditable 元素中設定插入符位置
旨在在contenteditable div 元素內的精確位置建立插入符可能是一項具有挑戰性的任務。在向線上社群尋求協助時，您可能遇到類似以下解決方案的JavaScript 解決方案：
const range = document.createRange();
const myDiv = document.getElementById("editable");
range.setStart(myDiv, 5);
range.setEnd(myDiv, 5);但是，儘管這種方法存在於網路知識庫中，但事實證明這種方法在Firefox 和Chrome中均無效.
擁抱範圍和選擇對象
糾正在這種情況下，釋放範圍和選擇對象的潛力至關重要。這些物件充當精確控制插入符號位置的看門人。
為了說明它們的應用，讓我們將插入符號移到第二行文字的第五個字元。實作方法如下：
function setCaret() {
var el = document.getElementById("editable")
var range = document.createRange()
var sel = window.getSelection()
range.setStart(el.childNodes[2], 5)
range.collapse(true)
sel.removeAllRanges()
sel.addRange(range)
}HTML 實作
要完全整合此解決方案，請將以下HTML 合併到您的程式碼中：
<div>
透過此實現，按一下按鈕可以將插入符號適當地定位在可編輯div中，從而使您可以對其進行細緻的控制安置。
以上是如何在ContentEditable Div中準確設定插入符位置？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
