Empêcher la surbrillance du tableau de texte

Question

J'ai une table et j'autorise les utilisateurs à "sélectionner" plusieurs lignes. Tout cela est géré à l'aide d'événements jQuery et de certains CSS pour indiquer visuellement que la ligne est 'sélectionnée'. Lorsque l'utilisateur appuie sur Maj, il est possible de sélectionner plusieurs lignes. Parfois, ce texte est mis en évidence. Est-il un moyen d'empêcher cela?

Answer 1

Il existe une propriété CSS3 pour cela.

 #yourTable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: moz-none;
    -ms-user-select: none;
    user-select: none;
}
 

Answer 2

Simplement, écrire quelque chose comme:

var domNode = $('#theDiv');
if (jQuery.browser.msie) {
   domNode.get(0).onselectstart = function () { return false; };
} else
{
    domNode.get(0).onmousedown = function(e){e.preventDefault()}
}

---

EDIT:

En cherchant sur internet, j'ai trouvé un blog avec un grand ideia, voir: http://aleembawany.com/2009/01/20/disable-selction-on-menu-items-with-this-jquery-extension/

Ainsi, vous pouvez insérer dans votre fichier js:

jQuery.fn.extend({ 
        disableSelection : function() { 
                return this.each(function() { 
                        this.onselectstart = function() { return false; }; 
                        this.unselectable = "on"; 
                        jQuery(this).css('user-select', 'none'); 
                        jQuery(this).css('-o-user-select', 'none'); 
                        jQuery(this).css('-moz-user-select', 'none'); 
                        jQuery(this).css('-khtml-user-select', 'none'); 
                        jQuery(this).css('-webkit-user-select', 'none'); 
                }); 
        } 
}); 

et l'utiliser à la place:

// disable selection on #theDiv object
$('#theDiv').disableSelection(); 

Answer 3

Juste une remarque sur la réponse de Cleiton ci-dessus - l'exemple de code semble bien fonctionner, mais pour être un bon citoyen du monde jQuery, vous devez renvoyer l'objet jQuery à la fin de la fonction afin qu'il soit chaînable - un simple L'addition d'une ligne corrige cela:

 jQuery.fn.extend({
    disableSelection : function() {
            this.each(function() {
                    this.onselectstart = function() { return false; };
                    this.unselectable = "on";
                    jQuery(this).css('-moz-user-select', 'none');
            });
            return this;
    }
});
 

À la vôtre, espérons que cela vous sera utile.

Answer 4

Je supprime simplement la sélection effectuée à l'aide de la touche Maj. Cela pourrait montrer un petit scintillement si

 if (event.shiftKey) {
    window.getSelection().removeAllRanges()
}
 

Answer 5

Si vous avez une interface utilisateur Jquery sur vos pages, utilisez simplement

     $("element-selector").disableSelection();