Question

我想问问题是文本范围或者可能的问题其他方法。我有一个文字。例如：

<div id="test">abcdefghij</div>

我使用文本范围突出显示黄色文本片段。（我使用示例发布到SO）。可以添加事件侦听器对于突出显示的文本，mouser？我想在用户时做点什么鼠标悬停在'cdefg'上。这是工作jsfiddle。

http://jsfiddle.net/8mdX4/673/

我很感激任何想法和建议。

祝你好运。

编辑：

我想分享一下我在主题之后所使用的方法。我正在使用选择的focusNode属性，因为commonAncestorContainer 获取所有节点的容器 - 而不是当前选择的节点。这是演示： http://jsfiddle.net/zono/Q3ptC/2/ 鼠标悬停在黄色文本上显示工具提示（标题属性的内容）。

Answer 1

您在代码中使用document.execCommand来设置元素样式，这很可能会创建<span>，但这取决于浏览器。这样做时，每个浏览器都会在目标文本中根据需要创建元素。据我所知，使用execCommand时没有可用的事件管理命令，因此使用这种技术会使这些元素的特定事件分配变得困难。

如果我从头开始编写代码，我会使用window.getSelection的方法并自己创建元素，以便我可以按照自己的意愿添加事件。

另一种选择是在知道execCommand已创建元素，找到选择的父级，并将事件添加到父节点后添加window.getSelection（）。像这样：

/*At a point where I know a selection is made*/
var sel = window.getSelection();
if (sel.rangeCount) {
    parent = sel.getRangeAt(0).commonAncestorContainer
    if (parent.nodeType != 1) {
        parent = parent.parentNode
    }

    parent.onclick = function() {
        alert("lookie lookie");
    }
}

您的代码更新了我的示例：

http://jsfiddle.net/8mdX4/680/

鼠标悬停事件着色与文本范围的文本对象片段

1 个答案: