Javascript/jQuery在可编辑的DIV中设置光标

Javascript/jQuery set cursor in editable DIV

本文关键字：DIV 置光标 编辑 jQuery Javascript      更新时间：2023-09-26

看了一些移动光标的方法，但似乎找不到一种优雅/有效的方法。

我基本上想调用一行代码来完成下面的psuedo代码。

  1. 获取可编辑div中的文本长度
  2. 将光标设置为最后一个字母

例如

这是示例文本|

光标设置为|是的位置

这有多简单？

Js报价：http://jsfiddle.net/v8agZ/5/

感谢

这是一种将光标放在可编辑div末尾的方法（根据此问题改编）。

HTML

<div id="mydiv">
    Lorem ipsum dolor sit amet,
    <br />
    <br />
    consectetur adipisicing elit
</div>

Javascript

function setCursorToEnd(ele) {
    var range = document.createRange();
    var sel = window.getSelection();
    range.setStart(ele, ele.childNodes.length - 1);
    range.collapse(true);
    sel.removeAllRanges();
    sel.addRange(range);
    ele.focus();
}
var mydiv = document.getElementById("mydiv");
setCursorToEnd(mydiv);

如果您想使用jQuery（在这种情况下这是无用的），您可以简单地使用$()和get()方法获得mydiv元素，如下所示：

var mydiv = $("#mydiv").get(0);
setCursorToEnd(mydiv);

我认为你可以使用jCaret插件

一个演示，而不是我的

相关文章：