Событие Trigger change () при установке значения с помощью функции val()

каков самый простой и лучший способ вызвать изменить событие при установке значения выберите элемент.

Я ожидал, что выполнение следующего кода

$('select#some').val(10);

или

$('select#some').attr('value',  10);

приведет к запуску события изменения, что, я думаю, довольно логично. Правильно?

Ну, это не так. Вам нужно triger change() событие, выполнив это

$('select#some').val(10).change();

или

$('select#some').val(10).trigger('change');

но я ищу какое-то решение, которое вызовет событие изменения, как только значение select будет изменено некоторым кодом javascript.

4 ответов


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

$('#selectField').change(function(){
    if($('#selectField').val() == 'N'){
        $('#secondaryInput').hide();
    } else {
        $('#secondaryInput').show();
}
});

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

$('#selectField').val(valueFromDatabase).change();

Так что, если существующее значение из базы данных "N", оно сразу же скрывает вторичное поле ввода в моей форме.


одна вещь, которую я узнал (трудный путь), это то, что вы должны были

$('#selectField').change(function(){
  // some content ...
});

определено перед использованием

$('#selectField').val(10).trigger('change');

или

 $('#selectField').val(10).change();

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

как вы, вероятно, знаете, установка значения select не вызывает событие change (), если вы ищете событие, которое запускается, когда значение элемента было изменено через JS, его нет.

если вы действительно хотите сделать это, я думаю, единственный способ-написать функцию, которая проверяет DOM на интервале и отслеживает измененные значения, но определенно не делает этого, если вы не должны (не знаете, почему вам когда-либо понадобится)

добавили это решение:
Другим возможным решением было бы создать свой собственный .val() функция обертки и запустить пользовательское событие после установки значения через .val(), тогда когда вы используете свой .val () обертка для установки значения <select> это вызовет ваше пользовательское событие, которое вы можете поймать и ручка.

Обязательно return this, Так что это цепной в jQuery моды


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

$("#selectField").change(function(){
  if(this.value === 'textValue1'){ $(".contentClass1").fadeIn(); }
  if(this.value === 'textValue2'){ $(".contentclass2").fadeIn(); }
});