首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >将键盘插入符号移动到元素的末尾。

将键盘插入符号移动到元素的末尾。
EN

Stack Overflow用户
提问于 2013-08-21 07:12:31
回答 1查看 2.6K关注 0票数 4

我在一个可满足的div中有几个元素。如何将键盘插入符放在id标识的特定元素的末尾,然后使用兰迪将其移动到兰迪的末尾

谢谢您的帮助和帮助。

EN

回答 1

Stack Overflow用户

发布于 2013-08-26 14:01:51

要在特定元素之后设置插入符号,您需要创建一个范围并将该范围应用于浏览器的选择对象,如下所示:

代码语言:javascript
复制
//get the browser selection object - it may or may not have a selected range
var selectionn = rangy.getSelection();

//create a range object to set the caret positioning for
var range = rangy.createRange();

//get the node of the element you wish to put the caret after
var startNode = document.getElementById('YourTagID');

//set the caret after the node for this range
range.setStartAfter(startNode);
range.setEndAfter(startNode);

//apply this range to the selection object
selection.removeAllRanges();
selection.addRange(range);

在某个时候,如果您想移动插入符号,那么您将执行与上面相同的操作,将其移动到“DIV”之后,尽管如果您希望选择范围从“A”标记之后移到“DIV”标记之后,则会这样做:

代码语言:javascript
复制
//get the browser selection object - it may or may not have a selected range
var selectionn = rangy.getSelection();

//create a range object to set the caret positioning for
var range = rangy.createRange();

//get the nodes of the elements you wish to put the range between
var startNode = document.getElementById('YourTagID');
var endNode = document.getElementById('YourDivTagID');

//set the caret after the node for this range
range.setStartAfter(startNode);
range.setEndAfter(endNode);

//apply this range to the selection object
selection.removeAllRanges();
selection.addRange(range);

如果您希望您的选择位于元素的末尾,但是在元素内部而不是在元素之后,那么您将执行类似的操作。

代码语言:javascript
复制
//get the browser selection object - it may or may not have a selected range
var selectionn = rangy.getSelection();

//create a range object to set the caret positioning for
var range = rangy.createRange();

//get the nodes of the elements you wish to put the range between
var startNode = document.getElementById('YourTagID');
var endNode = document.getElementById('YourDivTagID');

//set the caret after the start node and at the end of the end node
//Note: the end is set using endNode.length when the node is of the text type
//and it is set using childNodes.length when the end node is of the element type
range.setStartAfter(startNode);
range.setEnd(endNode, endNode.length || endNode.childNodes.length);

//apply this range to the selection object
selection.removeAllRanges();
selection.addRange(range);

几个重要的注意事项:

  1. 您不必通过ID获取开始或结束节点,但您必须以某种方式从DOM获取Node对象本身。
  2. 如果修改DOM,则可能正在销毁过程中的范围对象。这就是为什么第二个代码块再次创建范围的工作,而不是仅仅引用现有的范围。
票数 8
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/18351001

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档