Question

让我们假装我的网页有以下内容：

<p>This is the first sentence</p>
<p>This is the 2nd sentence.  This is the third.</>

如果我双击＆＃34;这＆＃34;在＆＃34;这是第一句＆＃34;我想突出显示（将其背景颜色改为黄色）单词的出现＆＃34;这＆＃34;

如果我双击＆＃34;这＆＃34;在＆＃34;这是第二句＆＃34;我想突出显示它并继续显示任何已创建的亮点。

如果我双击＆＃34;这＆＃34;在＆＃34;这是第一句＆＃34;在突出显示后，我想将其背景颜色更改回原始颜色并继续显示任何已创建的高光。

如果我双击＆＃34;第三个。＆＃34;我想突出显示＆＃34;第三＆＃34;

我已经看过很多关于如何使用jQuery执行此操作的示例，但最终会突出显示所选单词的所有匹配项。所以在上面的例子中，如果我点击＆＃34;这个＆＃34;在＆＃34;这是第一句＆＃34;然后所有出现的＆＃34;这个＆＃34;将突出显示。

有没有人知道如何只突出双击词？

Answer 1

如果您使用的是jQuery，这将有效。

$(document).dblclick(function(){
    $("html").attr("contenteditable", "true")
    document.execCommand("hiliteColor", false, "yellow")
    $("html").attr("contenteditable", "false")
})

更新：我制作了jsFiddle

Answer 2

我最终将每个单词包装在其中并附加了一个单击函数（是jquery调用的.click（function（）{}）？）

我创建了两个css类：一个是background = transparent而另一个是background = yellow

该功能检测到该类并根据需要进行切换

我如何突出我点击的单词？

2 个答案: