单击鼠标即可选择所有DIV文本 [英] Select all DIV text with single mouse click

问题描述

当用户点击DIV时，如何突出显示/选择DIV标签的内容...这个想法是所有文本都被突出显示/选中，因此用户无需手动突出显示文本鼠标可能会遗漏一些文字？

例如，假设我们有一个DIV如下：

 < div id =selectable> http：//example.com/page.htm< / div> 
  

...当用户点击任何该网址时，整个网址文字会突出显示，以便他们可以轻松地在浏览器中拖动选定的文本，或者右键单击复制完整的URL。

谢谢！

解决方案

  function selectText（containerid）{if（document.selection）{// IE var range = document.body.createTextRange（）; range.moveToElementText（的document.getElementById（数据筒））; range.select（）; } else if（window.getSelection）{var range = document.createRange（）; range.selectNode（的document.getElementById（数据筒））; window.getSelection（）removeAllRanges（）; 。window.getSelection（）的AddRange（范围）; }  

 < div id =selectableonclick = selectText（ '选择性'） > HTTP：//example.com/page.htm< / DIV>  

现在你必须传递ID作为参数，在这种情况下是可选择的，但它更全局，允许你多次使用它而不使用，如chiborg提到，jQuery。

How to highlight/select the contents of a DIV tag when the user clicks on the DIV...the idea is that all of the text is highlighted/selected so the user doesn't need to manually highlight the text with the mouse and potentially miss a bit of the text?

For example, say we've got a DIV as below:

<div id="selectable">http://example.com/page.htm</div>

...and when the user clicks on any of that URL the whole URL text is highlighted so they can easily drag the selected text around in the browser, or copy the complete URL with a right click.

Thanks!

解决方案

function selectText(containerid) {
    if (document.selection) { // IE
        var range = document.body.createTextRange();
        range.moveToElementText(document.getElementById(containerid));
        range.select();
    } else if (window.getSelection) {
        var range = document.createRange();
        range.selectNode(document.getElementById(containerid));
        window.getSelection().removeAllRanges();
        window.getSelection().addRange(range);
    }
}

<div id="selectable" onclick="selectText('selectable')">http://example.com/page.htm</div>

Now you have to pass the ID as an argument, which in this case is "selectable", but it's more global, allowing you to use it anywhere multiple times without using, as chiborg mentioned, jQuery.

这篇关于单击鼠标即可选择所有DIV文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！