HTML множественный выбор без Ctrl с ограниченным выбором - PullRequest
0 голосов
/ 01 октября 2018

Я обнаружил огромное количество проблем, связанных с моей проблемой.На самом деле, у меня есть решение о «без удержания кнопки Ctrl, чтобы выбрать параметр.»

Для лучшей справки: Выбор нескольких из элемента выбора HTML без использования клавиши Ctrl

Я получил лучшее решение в следующем вопросе.Но проблема в том, что мне нужна функция с обоими 1. без удержания кнопки Ctrl 2. ограниченная опция выбора менее 3

Здесь код для HTML-элемента выбора без использования клавиши ctrl

window.onmousedown = function (e) {
    var el = e.target;
    if (el.tagName.toLowerCase() == 'option' && el.parentNode.hasAttribute('multiple')) {
        e.preventDefault();

        // toggle selection
        if (el.hasAttribute('selected')) el.removeAttribute('selected');
        else el.setAttribute('selected', '');

        // hack to correct buggy behavior
        var select = el.parentNode.cloneNode(true);
        el.parentNode.parentNode.replaceChild(select, el.parentNode);
    }
}
select{
  width: 200px;
  height: 200px;
}
<select multiple>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
</select>

Здесь код для ограниченной опции с удержанием кнопки Ctrl:

$("select").on('change', function(e) {
    if (Object.keys($(this).val()).length > 3) {
        $('option[value="' + $(this).val().toString().split(',')[3] + '"]').prop('selected', false);
    }
});
select{
  width: 200px;
  height: 200px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<select multiple>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
</select>

Но я не могу сделать два сценария вместе.Я пробовал, но там работает только сценарий "без удерживания Ctrl".

Примечание: я нашел другой скрипт в jquery для активации "без удерживания Ctrl" в опции множественного выбора.Но они не отправили данные правильно.Вышеуказанный чистый JS идеально подходит для меня:)

Спасибо

1 Ответ

0 голосов
/ 01 октября 2018

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...