Selected text inside div

Question

I want this text inside <div> to be highlighten (selected for copy) when page loads.

<div id='sample_div'>This is sample text</div>

What i tried:

$(document).ready(function(){

$('#sample_div').select();

});

Please see this article for additional help: http://stackoverflow.com/questions/7959050/use-jquery-filter-to-select-specific-text-within-div — Tom Beech, Sep 04 '13 at 11:10

score 3 · Accepted Answer · edited May 23 '17 at 12:22

So if I assume correctly, you want the text inside a particular div to be highlighted..

function selectText(element) {
    var doc = document
        , text = doc.getElementById(element)
        , range, selection
    ;    
    if (doc.body.createTextRange) { //ms
        range = doc.body.createTextRange();
        range.moveToElementText(text);
        range.select();
    } else if (window.getSelection) { //all others
        selection = window.getSelection();        
        range = doc.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
    }
}

Working jsFiddle

Source

score 2 · Answer 2 · answered Sep 04 '13 at 11:16

The solution change based on the current browser, with older version of jQuery I use $.browser, but now is deleted; to check it's IE and use the correct code check if document.body.createTextRange exist like:

$(document).ready(function () {
    selectText('sample_div');
});

function selectText(element) {
    var text = document.getElementById(element);
    if (document.body.createTextRange) {
        var range = document.body.createTextRange();
        range.moveToElementText(text);
        range.select();
    } else {
        var selection = window.getSelection();
        var range = document.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
    } 
}

Demo: http://jsfiddle.net/IrvinDominin/bKPcX/

Selected text inside div

2 Answers2

Linked