JavaScript - 在鼠标悬停时选择范围文本

时间:2015-03-03 04:40:40

标签: javascript jquery html

我有这个HTML代码。

<div class="dontsplit" onmouseover="selCode('c111');">
  Face savoring delicious food <span class="notranslate" id="c111"></span>
</div>

我想在鼠标悬停div时选择span标记之间的值。我正在使用的代码就是这个。

function selCode(objId) {
    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);
    }
}

但它似乎不起作用。我该如何开展这项工作?

我再说一遍。当鼠标悬停在div上时,我需要自动选择跨度之间的文本。所以它可以很容易地复制。提前谢谢!

3 个答案:

答案 0 :(得分:1)

我认为这应该会有所帮助。

您可以使用jQuery .text()方法。

您有一个span notranslate类。

所以你可以做这样的事情来获取文字:

$(".notranslate").text();

http://jsfiddle.net/L8r6ns88/

答案 1 :(得分:1)

您的脚本正在进行第一次鼠标悬停,但第二次向内发送错误Discontiguous selection is not supported.,以便在进行新选择之前清除现有选择。

function selCode(objId) {
    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().removeAllRanges();
        window.getSelection().addRange(range);
    }
}

演示:Fiddle

答案 2 :(得分:0)

试试这个。我正在使用jquery来完成这项任务。

HTML

<div class="dontsplit">
  Face savoring delicious food <span class="notranslate" id="c111"></span>
</div>

<强> JS

$(function(){

  $('.dontsplit').on('mouseover','.notranslate', function(){
  console.log($(this).text()); //see result
 })
})