désactiver la sélection de texte tout en appuyant sur «shift»

Question

Je suis en train de mettre en œuvre la fonctionnalité de sélection d'éléments en javascript (en utilisant jQuery). article est un li qui contient du code HTML.
l'utilisateur peut cliquer sur un élément (le fait sélectionné), puis cliquez sur un autre élément pour sélectionner tous les éléments entre les deux. cela fonctionne essentiellement bien, mais le Maj-clic sélectionne également (en surbrillance) le texte qui apparaît à l'intérieur des éléments (la fonctionnalité de base du navigateur pour les clics sur Maj). est-il possible de désactiver cela?

Answer 1

Essayez un combo JavaScript et CSS pour empêcher la sélection en premier lieu:

$('li').attr('unselectable', 'on'); // IE 

css (pour les navigateurs non IE):

li { 
      user-select: none; /* CSS3 (little to no support) */ 
     -ms-user-select: none; /* IE 10+ */ 
     -moz-user-select: none; /* Gecko (Firefox) */ 
    -webkit-user-select: none; /* Webkit (Safari, Chrome) */ 
} 

Answer 2

Essayez ceci après la touche Maj + clic ...

document.getSelection().removeAllRanges(); 

Si cela ne suffit pas efficace, vous pourriez avoir à annuler aussi l'événement onselectstart ...

window.onload = function() { 
    document.onselectstart = function() { 
    return false; 
    } 
} 

Answer 3

J'ai une application comme ça. Trick est, je voulais permettre la sélection, mais je voulais aussi Ctrl-clic et Maj-clic pour sélectionner des éléments.

Ce que je trouve est que tout le monde, mais IE vous permet de battre ce en annulant l'événement mousedown et dans IE ce qui fonctionne le mieux est de désactiver temporairement onselectstart:

$("#id").mousedown(function (e) { 
    if (e.ctrlKey || e.shiftKey) { 
     // For non-IE browsers 
     e.preventDefault(); 

     // For IE 
     if ($.browser.msie) { 
      this.onselectstart = function() { return false; }; 
      var me = this; // capture in a closure 
      window.setTimeout(function() { me.onselectstart = null; }, 0); 
     } 
    } 
}); 

Answer 4

Si vous avez des cases à cocher dans vos lignes de table (articles), vous pouvez simplement mettre l'accent sur la case à cocher de la ligne une fois que vous avez fait la sélection. Mettre l'accent sur la case à cocher devrait éliminer la sélection du navigateur. Vous pouvez également vous concentrer sur une zone de texte ou un autre élément de formulaire. Pour JQuery,

$('tr').bind('click', function(e) { 
    // If shift key was down when the row was clicked 
    if (e.shiftKey) { 
    // Make the row selected 
    $(this).parent().children().slice($(last).index(), $(this).index()+1).addClass('selected').find('input:checkbox').attr('checked', true); 

    // Now focus on the checkbox within the row 
    $('input:checkbox', $(this)).focus(); 
    } 
});