Как программно изменить выбор, чтобы он запускал свое поведение при изменении?
-
22-07-2019 - |
Вопрос
Кажется, это не работает:
<select id="mySel" onchange="alert('foo')">
<option value="a">a</option>
<option value="b">b</option>
</select>
<script>
dojo.byId('mySel').value = 'b'; // select changes, but nothing is alerted
</script>
(Я использую додзё, но это не имеет особого значения.)
Решение
Имя onchange немного вводит в заблуждение, если вы не понимаете, что событие изменения и изменяемое значение - это не одно и то же. Событие изменения происходит, когда пользователь изменяет значение в браузере. Я считаю, что вы можете запустить событие вручную, вызвав dojo.byId ('mySel'). Onchange ()
после программного изменения значения. (Однако вам может понадобиться определить функцию, которая вызывает alert
. Я сам этого не делал.)
Другие советы
Это изменит значение, но не вызовет событие onchange. Каждый раз, когда вы изменяете элемент с помощью JavaScript, он не будет запускать событие (мешает вам столкнуться с проблемами рекурсии *).
Если вы настроите обработчик событий, например, так.
function myHandler(){
//do whatever stuff here
changeColor( dojo.byId('mySel') );
}
затем вы можете вызвать это отдельно, после того как вы установите значение программно.
Примечание (*): я не эксперт по додзё ... поэтому я полагаю, что они не добавили " автоматический вызов обработчиков событий при установке значения из JavaScript.
Вы можете взглянуть на эти вопросы и ответы на них:они могут помочь:
- Обнаружение программных изменений в поле выбора HTML.
- Как программно вызвать событие onchange на входе? (ориентирован на ввод, а не на выбор, но все равно может быть полезен)
Для тех, кто хочет вызвать событие change
, используя javascript.
var evObj = document.createEvent("HTMLEvents");
evObj.initEvent("change", true, true);
var elem = document.getElementById('some-id');
elem.dispatchEvent(evObj);
вы можете получить доступ к событию onpropertychange, которое содержит свойство в аргументах события, чтобы определить, какое свойство было изменено. Р>
Он обнаруживает изменения 'selectedIndex' и 'value' - просто тестовый случай 'propertyName'
<select id="mySel" onpropertychange="dothis(event);">
<option value="a">a</option>
<option value="b">b</option>
</select>
function dothis(event)
{
if (event.propertyName == "selectedIndex")
alert('selection changed');
}
вне головы ... (в настоящее время используется js-фреймворк asp.net, который совсем не похож)
Попробуйте вместо этого назначить selectedIndex.