标签：dom range contenteditable selection javascript

我有这段代码在工作,我只想了解为什么我一开始需要使用removeAllRanges. sel初始化时是否自动有范围？

function setCaret(boolean_position) {
   var range = document.createRange();
   var sel = window.getSelection();
   range.selectNodeContents($('#board_code')[0]);
   range.collapse(boolean_position);
   sel.removeAllRanges();
   sel.addRange(range);//setting the caret position
} 

解决方法:

是的,从window.getSelection()检索的选择不是一个空实例,如document.createRange()创建的范围.请注意,这些方法名称有所不同-一种创建新实例,另一种获取实例.

原因很简单-您可以有多个范围实例,每个实例包含不同的位置.但是每个文档只有一个选择.

因此,在添加范围之前,通常必须删除当前选择的旧范围.当然,除非您要扩展当前选择.

更新：正如Tim正确指出的那样,只有Firefox支持多个选择范围.这意味着只有在Firefox上,您才能一次选择多个DOM.您可以选择表的列或使用CTRL键添加更多选择.

因此,只有Firefox要求您在添加下一个之前执行removeAllRanges().其他浏览器将自动删除旧范围.

标签：dom,range,contenteditable,selection,javascript
来源： https://codeday.me/bug/20191030/1970781.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。