Есть ли событие onSelect или эквивалент для HTML <select>?

Question

У меня есть форма ввода, которая позволяет мне выбирать из нескольких вариантов и что-то делать, когда пользователь меняет выбор. Например,

<select onChange="javascript:doSomething();">
  <option>A</option>
  <option>B</option>
  <option>C</option>
</select>

Теперь doSomething() срабатывает только тогда, когда выбор меняет .

Я хочу вызвать doSomething(), когда пользователь выбирает любую опцию, возможно, снова такую ​​же .

Я пытался использовать обработчик onClick, но он срабатывает до того, как пользователь начинает процесс выбора.

Итак, есть ли способ вызвать функцию при каждом выборе пользователем?

Обновление:

Ответ, предложенный Дэррилом, казалось, работает, но он не работает последовательно. Иногда событие запускается, как только пользователь щелкает раскрывающееся меню, даже до того, как пользователь завершил процесс выбора!

Answer 1

Единственный верный ответ - не использовать поле выбора (если вам нужно что-то сделать, когда вы повторно выбираете тот же ответ).

Создать выпадающее меню с обычным div, кнопкой, показать / скрыть меню. Ссылка: https://www.w3schools.com/howto/howto_js_dropdown.asp

Можно было бы избежать, если бы можно было добавить прослушиватели событий к опциям. Если был прослушиватель onSelect для элемента select. И если щелчок мышью по полю выбора не усугубляет mousedown, mouseup и одновременно щелкают все по mousedown.

Answer 2

Я столкнулся с аналогичной необходимостью и закончил тем, что написал директиву angularjs для того же самого -

ссылка guthub - угловой выбор

Используется element[0].blur(); для удаления фокуса с метки выбора. Логика заключается в том, чтобы вызвать размытие при втором щелчке раскрывающегося списка.

as-select срабатывает, даже если пользователь выбирает то же значение в раскрывающемся списке.

DEMO - ссылка

Answer 3

Пожалуйста, обратите внимание, что обработчики событий не поддерживаются для тэга OPTION в IE, если подумать. Я придумала это решение, попробуйте его и оставьте свой отзыв:

<script>
var flag = true;
function resetIndex(selObj) {
    if(flag) selObj.selectedIndex = -1;
    flag = true;
}
function doSomething(selObj) {
    alert(selObj.value)
    flag = false;
}
</script>
<select onchange="doSomething(this)" onclick="resetIndex(this)">
<option value="A">A</option>
<option value="B">B</option>
<option value="C">C</option>
</select>

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

Answer 4

как насчет изменения значения выбора, когда элемент получает фокус, например (с помощью jquery):

$("#locationtype").focus(function() {
    $("#locationtype").val('');
});

$("#locationtype").change(function() {
    if($("#locationtype").val() == 1) {
        $(".bd #mapphp").addClass('show');
        $("#invoerform").addClass('hide');
    }
    if($("#locationtype").val() == 2) {
        $(".lat").val('');
        $(".lon").val('');
    }
});

Answer 5

<select name="test[]" 
onchange="if(this.selectedIndex < 1){this.options[this.selectedIndex].selected = !1}">
<option>1</option>
<option>2</option>
<option>3</option>
</select>

Answer 6

Давным-давно, но в ответ на первоначальный вопрос, это поможет? Просто поместите onClick в строку SELECT. Затем поместите то, что вы хотите, чтобы каждый OPTION делал в OPTION строках. а именно:

<SELECT name="your name" onClick>
<option value ="Kilometres" onClick="YourFunction()">Kilometres
-------
-------
</SELECT>

Answer 7

Я нашел это решение.

установить selectedIndex элемента select на 0 изначально

//set selected Index to 0

doSomethingOnChange(){

     blah ..blah ..

     set selected Index to 0

}

вызовите этот метод onChange event

Answer 8

Попробуйте это:

<select id="nameSelect" onfocus="javascript:document.getElementById('nameSelect').selectedIndex=-1;" onchange="doSomething(this);">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>

Answer 9

Вы можете использовать onChange: http://www.w3schools.com/TAGS/tag_Select.asp

Скопировано из http://www.faqs.org/docs/htmltut/forms/_SELECT_onChange.html onChange определяет JavaScript для запуска, когда пользователь выбирает один из вариантов. Это означает, что действие инициируется немедленно, когда пользователь выбирает элемент, а не при нажатии кнопки «Отправить».