我以这个简单的HTML为例:
<div id="editable" contenteditable="true"> text text text<br> text text text<br> text text text<br> </div> <button id="button">focus</button>
我想要简单的事情- 单击按钮时,我想将插入符号(光标)放入可编辑div中的特定位置。通过网络搜索,我将这个JS附加到了按钮单击上,但是它不起作用(FF,Chrome):
var range = document.createRange(); var myDiv = document.getElementById("editable"); range.setStart(myDiv, 5); range.setEnd(myDiv, 5);
是否可以像这样手动设置插入符号的位置?
在大多数浏览器中,您需要Range和Selection对象。您可以将每个选择边界指定为一个节点,并在该节点内指定一个偏移量。例如,要将插入符号设置为文本第二行的第五个字符,请执行以下操作:
Range
Selection
var el = document.getElementById("editable"); var range = document.createRange(); var sel = window.getSelection(); range.setStart(el.childNodes[2], 5); range.collapse(true); sel.removeAllRanges(); sel.addRange(range);
IE <9的工作原理完全不同。如果需要支持这些浏览器,则需要其他代码。