javascript - 如何在悬停时突出显示文本

Question

我所说的突出显示是指当您将鼠标拖动到文本上时对文本所做的操作。如果你使用 imgur.com 那么你就知道我想要什么。我在任何地方都找不到任何关于此的信息，这令人沮丧。帮忙？

编辑:好吧，我以为我已经说得足够清楚了，但我想还不够。我并不是的意思是我想改变悬停时的背景颜色。那是微不足道的。但是您知道当页面上有文本时，您单击文本并拖动鼠标，或者按 ctrl+A，背景颜色会发生变化，然后您可以复制文本吗？你知道吗，突出显示？选择？我不希望它看起来像通过更改背景颜色发生的那样，我希望它实际发生。在 imgur.com 上上传图像，您就会明白了吗。请注意，当您将鼠标悬停在上传图像的任何链接上时，文本将被选中 - 您可以复制它。

这就是为什么很难找到任何相关内容的原因。我得到的只是如何更改背景颜色的结果。

Answer 1

您需要组合these answers使用 mouseenter 事件:

function selectElementText(el, win) {
    el.focus();
    win = win || window;
    var doc = win.document, sel, range;
    if (win.getSelection && doc.createRange) {
        sel = win.getSelection();
        range = doc.createRange();
        range.selectNodeContents(el);
        sel.removeAllRanges();
        sel.addRange(range);
    } else if (doc.body.createTextRange) {
        range = doc.body.createTextRange();
        range.moveToElementText(el);
        range.select();
    }
}
window.onload = function() {
   var element = document.getElementById('TheElementToHighlight');
   element.onmouseover = function(e) {
       e = e || window.event;
       var target = e.target || e.srcElement;
       selectElementText(target);
   };
};

您可以将 jQuery 事件与 selectElementText 函数结合使用，但我不会使用其他响应中的 selectElementText 的 jQuery 版本，因为它使用浏览器嗅探而不是功能检测。