Question

我们可以得到右键单击的单词和该单词的x，y坐标吗？我试过了： document.onclick=getTextOnClick;

function getTextOnClick(e)
{
    console.log(e);
    if (window.getSelection) {
        txt = window.getSelection();
            console.log(">>>"+txt);
    } else if (document.getSelection) {
        // FireFox 
        txt = document.getSelection();
            console.log(txt);
    } else if (document.selection) {
        // IE 6/7 
        txt = document.selection.createRange().text;
            console.log(txt);
    }
}

现在这个代码可以用来选择一些文字，但是当我只点击八次或点击某个单词时，我能得到相同的结果吗？事件对象给我点击的坐标。我可以获得点击的单词的坐标吗？ Plz帮助

Answer 1

这可以使用纯JavaScript来完成，假设您的容器仅包含“简单”单词：

window.onload = function() {
    var oDiv = document.getElementById("Container");
    var rawHTML = oDiv.innerHTML;
    var arrWords = rawHTML.split(" ");
    oDiv.innerHTML = "";
    for (var i = 0; i < arrWords.length; i++) {
        var curWord = arrWords[i];
        var curSpan = document.createElement("span");
        curSpan.innerHTML = curWord;
        if (i < (arrWords.length - 1))
            curSpan.innerHTML += " ";
        curSpan.onclick = WordClicked;
        curSpan.oncontextmenu = WordClicked;
        oDiv.appendChild(curSpan);
    }
};

function WordClicked() {
    var word = this.innerHTML;
    alert("You clicked: " + word);
    return false;
}

Live test case - 处理左键和右键。

Answer 2

想到的一种方法是将每个单词放在自己的范围内。除此之外，我认为很难找到在所有浏览器上一致运行的解决方案。

Answer 3

你呢？

文字 - ＆gt;

<div id="foo">Hello I am a text. I have no clue why I am here or 
what I am good for, but I have QUOTES and other things I can offer.</div>

jQuery - ＆gt;

$('#foo').contents().each(function(_, node) {
    var nodelist = node.textContent.split(/\s/).map(function( word ) {
        return $('<span>', {
            text: word + ' ',
            click: function() {
                alert( $(this).text() );
            }
        }).get(0);
    });

    $('#foo').empty().append(nodelist);
});

演示 - ＆gt; http://jsfiddle.net/qLuEF/

如何获得在javascript中进行点击的单词

3 个答案: