今天小编跟大家讲解下有关html5中contenteditable 光标_如何设置光标位置 ，相信小伙伴们对这个话题应该有所关注吧，小编也收集到了有关html5中contenteditable 光标_如何设置光标位置 的相关资料，希望小伙伴们看了有所帮助。
在js中 光标是一个对象 当你选中某个元素的时候才会出现光标对象。比如：我们点击一个输入框 实际会产生一个选中对象-selection 这个对象我们可以通过indow.getSelection()来获取；selection只存在1个 所以当你切换到其他输入框额时候 selection同样会跟着变化的。在选中的情况下有一个光标叫做range 和selection一样。
在contenteditable 属性中 当点击该区域的时候 光标默认显示在区域内容最后一位。如：
这是内容哦！
需要点击才出现光标 而且它的位置在内容区域的最后面 如果我们需要打开页面默认就出现 而且出现在第一个位置上 该如何实现呢 下面将给出js的实现方法：
方法一:var p = document.getElementById('box'),
s = window.getSelection(),
r = document.createRange();
r.setStart(p, 0);
r.setEnd(p, 0);
s.removeAllRanges();
s.addRange(r);
如果你需要把元素清空 或者对应内容为空的时候 你可以这样做：var p = document.getElementById('box'),
s = window.getSelection(),
r = document.createRange();
p.innerhtml = '\u00a0';
r.selectNodeContents(p);
s.removeAllRanges();
s.addRange(r);
document.execCommand('delete', false, null);
方法二：var box= document.getElementById('box');
setTimeout(function() {
box.focus();
}, 0);
给box设置获取焦点。然后放置setTimeout中 延迟执行。
来源：爱蒂网
郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时候联系我们修改或删除，多谢。
