如何单击或双击网页上的某个单词来触发事件处理程序？

发布于 2024-07-21 00:41:59 字数 280 浏览 10 评论 0原文

这样的页面，

对于像http://www.answers.com

如果用户双击页面中的任何单词，将出现一个弹出框并显示该单词的定义。

我可以想出一种方法，使用 DOM 脚本来分解页面中的所有单词，然后使每个单词都位于单独的“span”元素下……但除此之外，如果所有文本都位于一个“p”元素，然后触发“p”元素节点来处理双击事件，但是没有简单的方法来判断单击了哪个单词？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

站稳脚跟 2024-07-28 00:41:59

您只需向整个文档添加双击事件，如下所示：

function get_selection() {
    var txt = '';
    if (window.getSelection) {
        txt = window.getSelection();
    } else if (document.getSelection) {
        txt = document.getSelection();
    } else if (document.selection) {
        txt = document.selection.createRange().text;
    }
    return txt;
}

$(document).dblclick(function(e) {
    var t = get_selection();
    alert(t);
});

如果您只希望此功能适用于选定的段落，则可以将选择器更改为 p.myclass 或类似的内容。这取决于双击一个单词会在浏览器中突出显示它的事实。说实话，我不太确定answers.com 是否真的这么做。

You simply add a double click event to the entire document, like so:

function get_selection() {
    var txt = '';
    if (window.getSelection) {
        txt = window.getSelection();
    } else if (document.getSelection) {
        txt = document.getSelection();
    } else if (document.selection) {
        txt = document.selection.createRange().text;
    }
    return txt;
}

$(document).dblclick(function(e) {
    var t = get_selection();
    alert(t);
});

If you only wanted this to work on select paragraphs, you would change the selector to p.myclass or something like that. This hinges on the fact double clicking a word highlights it in browsers. Not really sure if it's exactly how answers.com does it, to be honest.

回复收藏 0 原文