gpt4 book ai didi

javascript - 使用 javascript 获取选择的开始和结束

转载 作者:行者123 更新时间:2023-12-03 08:03:48 25 4
gpt4 key购买 nike

我有一个像这样的html字符串:

<div id="div">Hi how are<span>you?</span> Fine</div>

文本将出现“嗨,你好吗?很好”

我想使用鼠标选择字符串的一部分并获取开头和结尾从全文字符串中查看选择的内容。

例如,如果我选择“you”,我想获得start=11和end=14;

如果我选择“是你吗?”,我想获得start=7和end=15。

我写这个是为了获得选择:

function getSel() {
console.log(navigator.appCodeName);
if (window.getSelection) {
return window.getSelection();
} else if (document.getSelection) {
return document.getSelection();
} else if (document.selection) {
return document.selection.createRange().text;
}
}

这段代码获取开始和结束,但它不起作用:

$("#div").on('mouseup', function(e){
var text=getSel();
if(text.anchorNode === text.focusNode){
var n = {
node: text.anchorNode.parentNode.id,
start: text.anchorOffset,
end: text.focusOffset
}
//selection from right to left
if(n.start>=n.end) {
var tmp;
tmp=n.start;
n.start=n.end;
n.end=tmp;
}
}
else console.log("error in selection");
});

最佳答案

您的选择器错误。 $('#div') 实际上选择任何具有 id='div' 的元素。

我已经举了一个例子来说明它是如何完成的。如果我没有弄错你想要实现的目标。

function getSelectionText() {
var text = "";
if (window.getSelection) {
text = window.getSelection().toString();
} else if (document.selection && document.selection.type != "Control") {
text = document.selection.createRange().text;
}
return text;
}

$(function(){
$("#div").on('mouseup', function(e){
var thisText = $(this).text();
var selectedText = getSelectionText();
var start = thisText.indexOf(selectedText);
var end = start + selectedText.length;
if (start >= 0 && end >= 0){
console.log("start: " + start);
console.log("end: " + end);
}
});
});

<强> Fiddle

关于javascript - 使用 javascript 获取选择的开始和结束,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34481546/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com