Предотвратите выбор щелчка + перетаскивание в нескольких списках выбора

Question

У меня есть список с несколькими выборами, и я хочу отключить возможность выбора, используя щелчок + перетаскивание внутри него, так что только одно новое значение может быть выбрано за клик - но при в то же время я хочу продолжать использовать список как «множественный», чтобы я мог выбирать несколько значений с помощью элемента управления + щелчок.

Я пробовал возиться с onselectstart и ondragstart в тегах, но они, похоже, ничего не делают в нескольких списках выбора. Пример:

<Select id="foo" name="foo[]" multiple="yes" onselectstart="return false" onchange="ajaxFunction()" Size="5"> 
    <option value="" selected>Any</option> 
    <option value="bar" ondragstart=" return false;">foo</option> 
    <option value="foobar">bar</option> 
    <option value="barfoo">foobar</option> 
</Select> 

Я подозреваю, что мне может понадобиться использовать javascript, а не чистый html. Примечательно, что список выбора запускает событие onchange, что может быть ключом к этому - одна идея, которая приходит на ум, состоит в том, чтобы как-то подсчитать количество выборок, запускающих каждое событие onchange, и если более одного значения эти не обрабатываются в событии onchange или событие полностью отменяется. Надеюсь, однако, есть более простое решение.

Answer 1

Ну, я не мог найти способ отключения перетаскивания в html, но мне удалось создать функцию, которая нейтрализует несколько новых выборов, обновляя страницу. Кажется, что много причудливых ног для не очень большого эффекта, но в любом случае это работает для моих целей. Я оставлю этот вопрос открытым на день или два, прежде чем отмечать это как лучший ответ, только если кто-нибудь придумает лучшее решение.

function ajaxfunction(sel) 
    { 
     var total_selections_counter = 0; 
      //i.e. total selections passed to the onchange event, whether selected previously or not 
     var overlapping_selections_counter = 0; 
      //i.e. selections which were already selected and are also re-selected and passed to the onchange event 
     for (var i = 0; i < sel.options.length; i++) 
      { 
       if(sel.options[i].selected) 
        { 
         total_selections_counter++; 
        } 
       if(sel.options[i].selected && sel.options[i].defaultSelected) 
        { 
         overlapping_selections_counter++; 
        } 
      } 
     var new_selections_counter = total_selections_counter - overlapping_selections_counter; 
     if(new_selections_counter > 1) 
      { 
       location.reload(true); 
      } 
     else 
      { 
       alert("continue processing"); 
      } 
    }