如何将文本置于光标下？

Question

我正在尝试用jquery创建一个userscript。我希望它从游标下的元素中获取光标下的文本。问题是，我编写的脚本使用jQuery的.text()，它返回连接的子元素(如果元素有子元素)。知道如何只获取我点击的容器的文本吗？

(我用ebay.com试了一下，因为这个网站很复杂)

// ==UserScript==
// @name           Selector
// @namespace      http://userstyles.org
// @description    none
// @include        http://*.*
// @require        http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js
// ==/UserScript==

var $;

// Add jQuery
(function(){
    if (typeof unsafeWindow.jQuery == 'undefined') {
        var GM_Head = document.getElementsByTagName('head')[0] || document.documentElement,
            GM_JQ = document.createElement('script');

        GM_JQ.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';
        GM_JQ.type = 'text/javascript';
        GM_JQ.async = true;

        GM_Head.insertBefore(GM_JQ, GM_Head.firstChild);
    }
    GM_wait();
})();

// Check if jQuery's loaded
function GM_wait() {
    if (typeof unsafeWindow.jQuery == 'undefined') {
        window.setTimeout(GM_wait, 100);
    } else {
        $ = unsafeWindow.jQuery.noConflict(true);
        letsJQuery();
    }
}

function letsJQuery() {
    //alert("Loaded jQuery" + $().jquery); // check jQuery version

    $("*:not(html, head, body)").hover( function () {
             $(this).css("border", "1px dotted blue");
    }, 

    function () {                
            $(this).css("border", "none");
    }).click( function () {
           var s = $(this).text();
           if (s) alert(s);
           return false;
    });
}

Answer 1

您可以将一个click event handler绑定到文档并检查事件目标：

$(document).bind('click', function(e) {
    console.log('text: ', e.target.value || e.target.textContent || e.target.text);
});

更新

$(document).bind('click', function(e) {
    $(e.target).contents().each(function(index, elem) {
        if( elem.nodeType === 3 && $.trim(elem.nodeValue).length ) {
            console.log($.trim(elem.nodeValue));
            return false;
        }
    });
});

Answer 2

请修改单击功能，如下所示

function () {                
        $(this).css("border", "none");
}).click( function () {
       debugger;
       if($(this)[0].children.length == 0) {
        var s = $(this).text();
        if (s) alert(s);
       }
       return false;
});