set the cursor at the end of the string?

Question

When I replace a string with another, the cursor is moved to the beginning of the string in the text. Can the cursor be moved at the end instead of the start of the string?

index.jsp:

var val1=request.responseText;
var text=document.getElementById("para").innerHTML;
if(val1!="true")
{
    var afterplace=text.replace("good",val1);
    document.getElementById("para").innerHTML=afterplace;
}

After replacement the cursor come at the start of the word I want it at the end.

`para` is ID of what `input` or `div`? See http://jsfiddle.net/0mfk01h0/1/ — Manwal, Aug 17 '15 at 10:04
no there isnot any input i made the div contenteditable n i want to replace some text n position of the cursor should be in the end — kritika goyal, Aug 17 '15 at 10:10
possible duplicate of [contenteditable, set caret at the end of the text (cross-browser)](http://stackoverflow.com/questions/4233265/contenteditable-set-caret-at-the-end-of-the-text-cross-browser) — Abhitalks, Aug 17 '15 at 10:42

score 1 · Accepted Answer · answered Aug 17 '15 at 10:20

Consider following function for setting cursor at end of contenteditable element:

function setEndOfContenteditable(contentEditableElement)
{
    var range,selection;
    if(document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+
    {
        range = document.createRange();
        range.selectNodeContents(contentEditableElement);
        range.collapse(false);
        selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange(range);
    }
    else if(document.selection)//IE 8 and lower
    { 
        range = document.body.createTextRange();
        range.moveToElementText(contentEditableElement);
        range.collapse(false);
        range.select();
    }
}

Working DEMO

Full snippet:

var val1="testingtextgood";
var text=document.getElementById("para").innerHTML;
if(val1!="true")
{
    var afterplace=text.replace("good",val1);
    document.getElementById("para").innerHTML=afterplace;
    document.getElementById("para").focus()
    setEndOfContenteditable(document.getElementById("para"))
}

function setEndOfContenteditable(contentEditableElement)
{
    var range,selection;
    if(document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+
    {
        range = document.createRange();
        range.selectNodeContents(contentEditableElement);
        range.collapse(false);
        selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange(range);
    }
    else if(document.selection)//IE 8 and lower
    { 
        range = document.body.createTextRange();
        range.moveToElementText(contentEditableElement);
        range.collapse(false);
        range.select();
    }
}

score 0 · Answer 2 · answered Aug 17 '15 at 10:22

Use this code:-

var val1=request.responseText;
var text=document.getElementById("para").innerHTML;

if(val1!="true"){
    var afterplace=text.replace("good",val1);
    document.getElementById("para").innerHTML=afterplace;
    document.getElementById("para").focus();
    var val = document.getElementById("para").value;
    document.getElementById("para").value = '';
    document.getElementById("para").value = val;
}

It works fine for me.

set the cursor at the end of the string?

2 Answers2