如何突出显示 jquery 中的每个单词,以便为每个单词提供定义?
我想做的是允许用户滚动网页上的任何单词,当鼠标移到该单词上时,它会突出显示(我知道我可以使用悬停来实现这一点)。但是我不知道如何从段落中选择单个单词。最终目标是允许用户单击该单词,并且定义会出现在该单词上,但我认为一旦我可以将鼠标悬停在各个单词上,我就可以弄清楚这一点。
What I am trying to do is allow the user to scroll over any word on a web page and when the mouse goes over the word it is highlighted (I know I can use hover for that). However I do not know how to select individual words, from the paragraph. The ultimate goal is to allow the user to click on the word and a definition appears over the word, but I think I can figure that out once I can hover over individual words.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
Javascript 中无法做到这一点,一般来说,您可以与之交互的最小的东西是 DOM 元素。因此,从技术上讲,您可以将每个单词包装在
中,但这似乎严重过度,并且可能还会对性能产生巨大影响。
相反,大多数提供此功能的网站所做的是,每当您选择文本时,它们都会执行悬停弹出窗口(请参阅此问题以获取一些代码来获取当前选择)。
就我个人而言,我觉得这真的很烦人(例如,nytimes.com 就是这样做的),但也许这只是我的看法......
There is no way in Javascript to do that, the smallest thing you can interact with, in general, is a DOM element. So you could technically wrap each word inside a
<span>
, but that would seem to be seriously overkill and probably have a huge performance impact as well.Instead, what most sites do, that provide this functionality, is they do the hover popup thing whenever you select text (see this question for some code to get the current selection).
Personally, I find it really irritating (nytimes.com does it like that, for example), but maybe that's just me...
如果您想要类似于 NYtimes 提供的内容,我建议您使用 JQuery 中的 Select Link 插件,该插件提供对文本中选择的任何单词的搜索。授予此链接。
If you want something similar to what the NYtimes provides, I suggest that you use the Select Link plugin in JQuery, which provides a search for any word that is selected in your text. Confer this link.