在元素后设置光标

小狗桦木

我有这个代码

elementSpan = document.createElement('span').className = 'mainSpan';
elementSpan.innerHTML = '<span class="childSpan">A</sapn>';
range.insertNode(elementSpan);
range.setStartAfter(elementSpan);  //the problem am having

现在我将游标设置elementSpan为在contentcontentable div中后的游标之后elementSpan但不是游标于游标之后的游标,而是游标在游标内的文本之后A<span class="childSpan">但我希望它在游标之后elementSpan请任何知道如何执行此操作的人?

Sabithpocker

再次经历了您的问题,这是我能上班的最接近的问题。这将在末尾创建一个虚拟对象a&nbsp;并将光标移到其后。两者a&nbsp;都很重要,因为没有这些浏览器(Safari,Chrome),由于进行了一些优化迫使键入的文本进入最后一个元素。代码将光标移动到下一个元素(如果已经存在),可以通过删除来将其删除if

我不是范围/选择API的专家。期待看到其他有趣的答案。

elementSpan = document.createElement('span');
elementSpan.className = 'mainSpan';
document.getElementById('ce').appendChild(elementSpan);
elementSpan.innerHTML = '<span id="childSpan">Another text</span>'; //the problem am having
setCursorAfterElement(document.getElementById('childSpan'));

function setCursorAfterElement(ele) {
  if (!ele.nextElementSibling) {
    var dummyElement = document.createElement('a')
    dummyElement.appendChild(document.createTextNode('\u00A0'))
    ele.parentNode.appendChild(dummyElement)
  }
  var nextElement = ele.nextElementSibling
  nextElement.tabIndex=0
  nextElement.focus()
  var r = document.createRange();
  r.setStart(nextElement.childNodes[0], 1);
  r.setEnd(nextElement.childNodes[0], 1);

  var s = window.getSelection();
  s.removeAllRanges();
  s.addRange(r);
  //document.execCommand("delete", false, null);
}
#childSpan {
  border: 1px solid red;
  margin: 0px;
}
<div id="ce" contenteditable="true">
</div>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用 jQuery 在 SPAN 元素后设置值

来自分类Dev

如何在onClick元素后设置回调函数?

来自分类Dev

如何在onClick元素后设置回调函数?

来自分类Dev

将元素设置为不可点击,然后设置为可点击

来自分类Dev

HTML元素的游标在之后设置,但在拖动过程中未设置

来自分类Dev

如何在contentEditable元素的子元素中设置光标?

来自分类Dev

将在加载元素后设置onload属性仍然运行处理程序?

来自分类Dev

自定义元素中的@media查询-仅最后设置生效

来自分类Dev

克隆后设置Laravel项目

来自分类Dev

在replaceWith之后设置焦点

来自分类Dev

在If命令之后设置命令

来自分类Dev

在replaceWith之后设置焦点

来自分类Dev

安装后设置Debian镜像

来自分类Dev

在jAlert之后设置焦点

来自分类Dev

验证后设置模型数据

来自分类Dev

安装后设置文件权限

来自分类Dev

设备重启后设置告警

来自分类Dev

克隆后设置Laravel项目

来自分类Dev

从json检索后设置图像的大小

来自分类Dev

jQuery在按Tab键后设置焦点

来自分类Dev

Symfony 3:提交表单后设置值

来自分类Dev

Vaadin填充后设置组合框值

来自分类Dev

Javascript-在警报消息后设置焦点

来自分类Dev

创建新用户后设置

来自分类Dev

Summernote:初始化后设置焦点

来自分类Dev

Android:在setOnClickListener之后设置setOnTouchListener

来自分类Dev

在成功的ajax调用后设置变量

来自分类Dev

定义函数名称后设置

来自分类Dev

与大熊猫合并后设置索引?