select any HTML text in element with jQuery

The following script jQuery extension selects any text from a given jQuery selector. Tested with Firefox and Safari – should work in IE6+ as well.

jQuery.fn.extend({
  selectText: function() {
    var text = $(this)[0];
    if ($.browser.msie) {
      var range = document.body.createTextRange();
      range.moveToElementText(text);
      range.select();
    } else if ($.browser.mozilla || $.browser.opera) {
      var selection = window.getSelection();
      var range = document.createRange();
      range.selectNodeContents(text);
      selection.removeAllRanges();
      selection.addRange(range);
    } else if ($.browser.safari) {
      var selection = window.getSelection();
      selection.setBaseAndExtent(text, 0, text, 1);
    }
    return $(this);
  }
})

To use it simly do:

var shortSelector = $('#name').selectText();
var longSelector = $('ul#names li:contains("Hampel")').selectText();

written on top of Source and Source

Leave a Reply
  1. (required)
  2. (will not be published) (required)