我最近发现,您可以使用Chrome编程创建不是连续的选择,通过替换要选择或隐藏的部分之间的元素/文本节点,然后显示它们.
Chrome连续选择示例:http://jsfiddle.net/niklasvh/YKJBW/
var t = $('div').contents().get(0); $.each(t.nodeValue.split(" "),function(i,e){ t = t.splitText(e.length); if (t.length>0){ t = t.splitText(1); } }); var c = $('div').contents(); $.each(c,e){ if (i>0){ if (i%3) { }else{ e.parentNode.replaceChild($('<unselect />').text(e.nodeValue).get(0),e); } } }); $('unselect').hide(); window.setTimeout(function(){ $('unselect').show(); },0);
然而,当执行复制事件时,整个选择确实被选择(即使它之间存在间隙),但是当然也可以使用相同的方法来在执行复制事件之前编程地改变选择.
现在的棘手部分是,您可以通过在Firefox中按住Ctrl键来实现此功能的可用性,以创建非连续选择.在本示例中使用的当前方法将TextNodes分成许多部分,这对于视觉目的没有任何区别.然而,它也使用额外的标签来破坏选择,据我所知,这些选项不能被删除.但是,通过删除TextNodes并为其添加新的文本可以达到相同的功能.问题是它只会考虑添加的最后一个节点,所以如果你选择了多个空格,它只会考虑你应用的最后一个DOM更改.
任何人都可以想到任何非文档破坏的方法来应用这种不连续的选择,这不会对选择及其元素进行任何永久的更改?
原来的问题
可以在Google Chrome中进行非连续的选择吗?例如,如果你有一个这样的文本元素:
< div>这是一些随机文本< / div>
是否有可能进行选择,其中包含例如这是和文本之间的文本中间未选择?
这似乎在FF中可以正常工作,在那里你可以不相邻的addRanges,并且相应地进行选择.
对于IE,似乎没有什么可以让你有多个范围,但是IE的选择对象有很多补偿方法.
通过非连续选择,您可以随时从网站附加或预先添加某个部分,例如在执行复制操作时,或强制用户取消选择某些部分的选择,而这些部分不希望它们复制.
非连续选择示例:
working example(至少在FF4工作).
编辑
要手动执行相同类型的选择,您可以使用firefox按住ctrl并开始拖动不同位置的文本,但在chrome上执行它不起作用.
解决方法
WebKit并不打算在很短时间内支持多个选定的范围,从我可以收集到的内容. IE对IE 9的Range和Selection API进行了大修,没有实现. Opera不知道Opera是否有任何支持的计划.有关信息,请参阅this thread from the WHATWG mailing list: