Javascript 选择文字边界,但不包括标点符号
我试图修改用户所做的选择,使其始终是完整的单词。例如,鉴于文本“报告:奥巴马总统寻求在阿富汗保留9800名美军……今年之后,消息来源说”,如果用户选择“fghanist”,我希望选择修改为“阿富汗”。经过一番搜索,我在Stackoverflow上偶然发现了以下解决方案:Javascript 选择文字边界,但不包括标点符号,javascript,html,dom,selection,Javascript,Html,Dom,Selection,我试图修改用户所做的选择,使其始终是完整的单词。例如,鉴于文本“报告:奥巴马总统寻求在阿富汗保留9800名美军……今年之后,消息来源说”,如果用户选择“fghanist”,我希望选择修改为“阿富汗”。经过一番搜索,我在Stackoverflow上偶然发现了以下解决方案: snapSelectionToWord : function() { var sel; if (window.getSelection && (sel = window.getSelection()).m
snapSelectionToWord : function() {
var sel;
if (window.getSelection && (sel = window.getSelection()).modify) {
sel = window.getSelection();
if (!sel.isCollapsed) {
// Detect if selection is backwards
var range = document.createRange();
range.setStart(sel.anchorNode, sel.anchorOffset);
range.setEnd(sel.focusNode, sel.focusOffset);
var backwards = range.collapsed;
range.detach();
// modify() works on the focus of the selection
var endNode = sel.focusNode, endOffset = sel.focusOffset;
sel.collapse(sel.anchorNode, sel.anchorOffset);
var direction = [];
if (backwards) {
direction = ['backward', 'forward'];
} else {
direction = ['forward', 'backward'];
}
sel.modify("move", direction[0], "character");
sel.modify("move", direction[1], "word");
sel.extend(endNode, endOffset);
sel.modify("extend", direction[1], "character");
sel.modify("extend", direction[0], "word");
}
} else if ( (sel = document.selection) && sel.type != "Control") {
var textRange = sel.createRange();
if (textRange.text) {
textRange.expand("word");
// Move the end back to not include the word's trailing space(s), if necessary
while (/\s$/.test(textRange.text)) {
textRange.moveEnd("character", -1);
}
textRange.select();
}
}
},
原则上,它工作得相当好。然而,也有一些悲惨的案例。例如,选择“fghanistan..”后会出现“Afghanistan…after”(我想要“Afghanistan”)。对于selection“.afte”(此处的期望结果:“after”)我得到了相同的结果。主要问题似乎是粒度word
只考虑空格,而不考虑其他标点符号
我现在的想法是将粒度从word
更改为character
,并将其放入循环中,直到达到标点符号为止。这对于sel.modify(“extend”,…)非常有效代码>行,但不适用于sel.modify(“移动”,…)代码>行。在折叠
和第一次移动
修改之后,sel.toString()
为空。因此,我无法循环第一个/最后一个字符以逐字符移动。sel.extend后(endNode,endOffset)
,sel.toString()
再次设置,并且使用循环的方法有效
我就是想不起这个问题。我偶然发现了它,它很好地解决了我的问题。使用此库可将我的功能简化为:
snapSelectionToWord : function() {
rangy.getSelection().expand("word");
},
感谢开发者让我的生活变得如此轻松 自动选择整个单词的应用程序让我发疯。请注意,有些用户会非常讨厌此功能。:-)罗布,同意!我也不喜欢被人光顾:)。然而,我的目标是开发一个用户注释文本片段的系统。也就是说,他们首先选择一个代码段,然后可以对其进行注释。我认为在这种情况下,抓住单词边界是合理的。