我正在尝试将样式应用于用户选择的文本（鼠标拖动），为此我需要获取所选文本的开始和结束索引。
我尝试过使用“indexOf(...)”方法。但它返回所选子字符串的第一次出现。我想要子字符串相对于原始字符串的实际位置。例如..，如果我选择位置 3 处的字母“O”[YOLOCobe]，我期望索引为 3，但 indexOf() 方法返回 1，这是 [Y 中第一次出现 'O'O洛·科布]。
是否有任何其他方法可以获取所选文本的实际开始和结束索引，而不是第一次出现？
function getSelectionText()
{
var text = "";
if (window.getSelection) {
text = window.getSelection().toString();
}
return text;
}
document.getElementById('ip').addEventListener('mouseup',function(e)
{
var txt=this.innerText;
console.log(txt);
var selectedText = getSelectionText();
console.log(selectedText);
var start = txt.indexOf(selectedText);
var end = start + selectedText.length;
if (start >= 0 && end >= 0){
console.log("start: " + start);
console.log("end: " + end);
}
});
<div id="ip">YOLO Cobe</div>
您正在寻找的内容可在返回的对象内找到window.getSelection()
document.getElementById('ip').addEventListener('mouseup',function(e)
{
var txt = this.innerText;
var selection = window.getSelection();
var start = selection.anchorOffset;
var end = selection.focusOffset;
if (start >= 0 && end >= 0){
console.log("start: " + start);
console.log("end: " + end);
}
});
<div id="ip">YOLO Cobe</div>
以下是基于 @Kaiido 评论的页面上更复杂选择的示例：
document.addEventListener('mouseup',function(e)
{
var txt = this.innerText;
var selection = window.getSelection();
var start = selection.anchorOffset;
var end = selection.focusOffset;
console.log('start at postion', start, 'in node', selection.anchorNode.wholeText)
console.log('stop at position', end, 'in node', selection.focusNode.wholeText)
});
<div><span>Fragment1</span> fragment2 <span>fragment3</span></div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
