2013-04-13 107 views
3

继承人jQuery代码,设置在内容编辑DIV光标位置定位10无法设置光标位置在内容编辑格 - Jquery的

var range,selection; var contentEditableElement = $("div#editMe"); 
if(document.createRange)//Firefox, Chrome, Opera, Safari, IE 9+ 
{ 
range = document.createRange(); 
range.selectNodeContents(contentEditableElement); 
range.collapse(true); 
range.setStart(contentEditableElement,0); 
range.setEnd(contentEditableElement,10); 
selection = window.getSelection(); 
selection.removeAllRanges(); 
selection.addRange(range); 
} 

但这那些不工作。有什么问题 。 ??

回答

2

这是一个工作示例。它似乎没有工作,如果我只把文本里面的div,我必须把每个单独的字符每个元素。另外请注意,您必须在jquery对象上使用.get(0)才能实际获得与range.setStart和range.setEnd一起使用的dom对象。

HTML:

<div id="editMe"> 
    <span>a</span><span>b</span><span>c</span><span>d</span><span>e</span><span>f</span><span>g</span><span>h</span><span>i</span><span>j</span><span>k</span><span>l</span><span>m</span><span>n</span> 
</div> 

<button onclick="do_select()"> 
    select characters 
</button> 

JS:

function do_select() 
{ 
    var element = $("div#editMe").get(0); 
    var range = document.createRange(); 

    range.collapse(true); 
    range.setStart(element,0); 
    range.setEnd(element,10); 

    var selection = window.getSelection(); 
    selection.removeAllRanges(); 
    selection.addRange(range); 
} 

http://jsfiddle.net/y8pWs/