get cursor position in contenteditable div

Blue-eyed Bison answered on March 27, 2021 Popularity 9/10 Helpfulness 6/10

answer get cursor position in contenteditable div

get cursor position in contenteditable div

Comment

function cursor_position() {
    var sel = document.getSelection();
    
    var pos = sel.toString().length;
    if(sel.anchorNode != undefined) sel.collapseToEnd();

    return pos;
}

// Demo:
var elm = document.querySelector('[contenteditable]');
elm.addEventListener('click', printCaretPosition)
elm.addEventListener('keydown', printCaretPosition)

function printCaretPosition(){
  console.log( cursor_position(), 'length:', this.textContent.trim().length )
}

Popularity 9/10 Helpfulness 6/10 Language javascript

Source: stackoverflow.com

Tags: contenteditable cursor-position get javascript

Link to this answer
Share Copy Link