Set cursor position to the end of a text wrapped in a div

Question

I'd like to know how to move the cursor position to the end of my text wrapped by a "contenteditable" DIV...

My code below selects all my text in the DIV element... But I just would like to add the cursor at the end of the text without selecting all the text...

My .js code:

  $mydiv.wrapInner('<div contenteditable="true" id="editableCase"></div>');
  var range = document.createRange();
  range.selectNodeContents(document.getElementById("editableCase"));
  var sel = window.getSelection();
  sel.removeAllRanges();
  sel.addRange(range);
  _case.$element.children().children().focus();

score 1 · Accepted Answer · answered May 27 '14 at 12:55

1

This is the common answer to this issue :

function placeCaretAtEnd(el) {
        el.focus();
        if (typeof window.getSelection != "undefined"
                && typeof document.createRange != "undefined") {
            var range = document.createRange();
            range.selectNodeContents(el);
            range.collapse(false);
            var sel = window.getSelection();
            sel.removeAllRanges();
            sel.addRange(range);
        } else if (typeof document.body.createTextRange != "undefined") {
            var textRange = document.body.createTextRange();
            textRange.moveToElementText(el);
            textRange.collapse(false);
            textRange.select();
        }
    }

    placeCaretAtEnd( document.getElementById("content") );

answered May 27 '14 at 12:55

user3241019

811
9
20

Seems not working, this code place the cursor at the start of the text... – tonymx227 May 27 '14 at 13:02
Do you use Chrome browser ? – user3241019 May 27 '14 at 15:30
Sorry, it works, it was an issue with the cache... – tonymx227 May 27 '14 at 15:39
No pb, I did a JSFiddle you can use [here](http://jsfiddle.net/hxQdV/64/) with a button that works – user3241019 May 27 '14 at 15:41

Set cursor position to the end of a text wrapped in a div

1 Answers1