Отключить выбор текста, нажав "shift"

Я реализую функцию выбора элементов в javascript (используя jQuery). item - это li, который содержит некоторый html.
пользователь может щелкнуть по одному элементу (делает его выбранным), а затем щелкнуть по другому элементу, чтобы выбрать все элементы между ними. это в основном работает нормально, однако сдвиг-щелчок также выбирает (higtlights) текст, который появляется внутри элементов (основная функциональность браузера для щелчков сдвига). есть ли способ отключить это?

Ответ 1

Попробуйте комбо JavaScript и css, чтобы предотвратить выбор в первую очередь:

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

css (для браузеров не 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) */
}

Ответ 2

Попробуйте это после нажатия Shift +...

document.getSelection().removeAllRanges();

Если это недостаточно эффективно, возможно, вам придется отменить событие onselectstart...

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

Ответ 3

У меня есть приложение вроде этого. Trick, я хотел разрешить выбор, но я также хотел нажать Ctrl-клик и Shift-click для выбора элементов.

Я обнаружил, что каждый, кроме IE, позволяет вам победить это, отменив событие mousedown, а в IE самое лучшее - временно отключить 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);
        }
    }
});

Ответ 4

Если у вас есть флажки в строках (элементах) таблицы, вы можете просто установить фокус на флажок для строки после того, как вы сделали выбор. Фокусировка на флажке должна избавиться от выбора браузера. Вы также можете сосредоточиться на текстовом поле или другом элементе формы. Для 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();
  }
});

Ответ 5

Этот код остановит выделение текста только при нажатой клавише "Shift". Если вы отпустите его, вы можете выбрать текст как обычно. В настоящее время я использую этот код ES6.

["keyup","keydown"].forEach((event) => {
    window.addEventListener(event, (e) => {
        document.onselectstart = function() {
            return !(e.key == "Shift" && e.shiftKey);
        }
    });
});