将光标设置在字符串末尾？

Question

当我用另一个字符串替换一个字符串时，光标会移动到文本中字符串的开头。能否将光标移动到字符串末尾而不是开头?

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;
}

替换后，光标会移到我想要的单词开头，而我希望它在单词结尾。

- kritika goyal

---

para是什么的ID，input还是div？请参考http://jsfiddle.net/0mfk01h0/1/。 - Manwal

div实际上不是段落。 - kritika goyal

你在哪里可以看到DIV的光标？有任何输入吗？ - Manwal

没有任何输入，我将div的内容设置为可编辑，并希望替换一些文本，光标位置应该在末尾。 - kritika goyal

@kritikagoyal 嗨，请提供带有此代码的HTML代码。 - Himesh Aadeshara

可能是contenteditable, set caret at the end of the text (cross-browser)的重复问题。 - Abhitalks

Answer 1

考虑以下函数来设置光标在 contenteditable 元素的末尾：

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();
    }
}

工作演示

完整代码片段：

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();
    }
}

- Manwal

Answer 2

使用以下代码：-

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;
}

对我来说它运行良好。

- napster