Live Demo :)

Question

http://cdnjs.com/libraries/twitter-bootstrap/

在这个网站上，当我鼠标悬停链接给定文本被选中（如鼠标文本选择而不是CSS样式）。

我试图检查检查元素中发生了什么变化我没找到。

我试图找出js或jquery是否有方法来做到这一点。我找到了jquery的.select（）方法，但它只能在表单元素上使用，而jquery中没有deselect（）方法，所以它的定义没有。

引擎盖下是什么？

更新：

我找到了solution 我在jsfiddle尝试了它，它完美无缺。但它用jom节点编写了js，它看起来像希腊语和拉丁语给我。我无法编写此算法的jquery版本。

HTML：

<p id="selectable">hello</p>

JS：

function fnSelect(objId) {
    fnDeSelect();
    if (document.selection) {
    var range = document.body.createTextRange();
        range.moveToElementText(document.getElementById(objId));
    range.select();
    }
    else if (window.getSelection) {
    var range = document.createRange();
    range.selectNode(document.getElementById(objId));
    window.getSelection().addRange(range);
    }
}

function fnDeSelect() {
    if (document.selection) document.selection.empty(); 
    else if (window.getSelection)
            window.getSelection().removeAllRanges();
}

$(document).ready(function(){
    $("p").on("mouseover",function(){
        var id = $(this).attr("id");
        fnSelect(id);
    });    
    $("p").on("mouseout",function(){
        fnDeSelect();
   });
});

Answer 1

发现这种情况比应该的情况更麻烦。以下是您可以使用的内容：

<强> From MDN:

window.getSelection().selectAllChildren(elementObject);

<强> Extended studies found here (MDN again)

如果是我，我会这样做才能达到效果：

function onMouseOver(e) {
    window.getSelection().selectAllChildren(e.currentTarget);
}
function onMouseOut(e) {
    window.getSelection().removeAllRanges(e.currentTarget);
}
document.getElementById("top").addEventListener("mouseenter", onMouseOver, false);
document.getElementById("top").addEventListener("mouseleave", onMouseOut, false);

文本选择（准备使用剪贴板操作）

1 个答案:

Live Demo :)