DevTics.com.Mx

Hoy estuve investigando como evitar la selección de texto en JavaScript o ver si ya existía algo en jQuery, primero en JS me encontré esta solución pero no me gusto porque en si lo que se hace es cancelar el evento onselectstart y onmousedown y con ello evitar que la selección inicie

Después busque si había algo utilizando jQuery pero solo me encontré esta forma un poco más elegante que la anterior, que consiste en modificar la propiedad unselectable y los css MozUserSelect y KhtmlUserSelect. pero la forma en que lo aplica el autor no me agrado mucho.. así que me decidí a crear este mini plugin para hacerlo reutilizable y más elegante

/*
* selectTextOff; plugin para evitar la selección en los elementos seleccionados por jQuery
* 22/08/2011
* JFcoDíaz (http://www.devtics.com.mx)
* MIT/GNU
*/
(function($){
  $.fn.extend({
    selectOff : function(){
     this.attr('unselectable', 'on').css({
        'KhtmlUserSelect' : 'none',
        'MozUserSelect' : 'none'
      }).each(function(i,o){
        o["onselectstart"] = o['onmousedown'] = function(){return false;}
      });
    }
  });
})(jQuery);

ahora bastaría con llamar selectOff

$("#unDiv").selectOff();

Dejando todo seleccionable a excepción del “#unDiv”… o bien Toda la web:

$("body").selectOff();

Ya que el plugin es muy pequeño no dejo un .js, solo copia y pega en uno de tus .js que uses en tu web (recuerda incluir los comentarios)

This entry was posted on Monday, August 22nd, 2011 at 2:14 pm. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.