Val() не вызывает change() в jQuery

Ответ 1

onchange срабатывает только тогда, когда пользователь вводит во вход, а затем вход теряет фокус.

Вы можете вручную вызвать событие onchange, используя после установки значения:

$("#mytext").change(); // someObject.onchange(); in standard JS

В качестве альтернативы вы можете trigger использовать событие:

$("#mytext").trigger("change");

Ответ 2

От redsquare отличное предложение, это работает хорошо:

$.fn.changeVal = function (v) {
    return this.val(v).trigger("change");
}

$("#my-input").changeVal("Tyrannosaurus Rex");

Ответ 3

Вы можете очень легко переопределить функцию val для запуска изменения, заменив ее прокси-сервером на исходную функцию val.

просто добавьте этот код где-нибудь в вашем документе (после загрузки jQuery)

(function($){
    var originalVal = $.fn.val;
    $.fn.val = function(){
        var result =originalVal.apply(this,arguments);
        if(arguments.length>0)
            $(this).change(); // OR with custom event $(this).trigger('value-changed');
        return result;
    };
})(jQuery);

Рабочий пример: здесь

(Обратите внимание, что это всегда будет вызывать change при val(new_val) даже если значение на самом деле не изменилось.)

Если вы хотите инициировать изменение ТОЛЬКО, когда значение действительно изменилось, используйте это:

//This will trigger "change" event when "val(new_val)" called 
//with value different than the current one
(function($){
    var originalVal = $.fn.val;
    $.fn.val = function(){
        var prev;
        if(arguments.length>0){
            prev = originalVal.apply(this,[]);
        }
        var result =originalVal.apply(this,arguments);
        if(arguments.length>0 && prev!=originalVal.apply(this,[]))
            $(this).change();  // OR with custom event $(this).trigger('value-changed')
        return result;
    };
})(jQuery);

Живой пример для этого: http://jsfiddle.net/5fSmx/1/

Ответ 4

Вам нужно связать метод следующим образом:

$('#input').val('test').change();

Ответ 5

Нет, вам может потребоваться запустить его вручную после установки значения:

$('#mytext').change();

или

$('#mytext').trigger('change');

Ответ 6

Похоже, что события не пузырятся. Попробуйте следующее:

$("#mybutton").click(function(){
  var oldval=$("#mytext").val();
  $("#mytext").val('Changed by button');
  var newval=$("#mytext").val();
  if (newval != oldval) {
    $("#mytext").trigger('change');
  }
});

Надеюсь, это поможет.

Я попробовал просто старое $("#mytext").trigger('change') без сохранения старого значения, а .change срабатывает, даже если значение не изменилось. Вот почему я сохранил предыдущее значение и назвал $("#mytext").trigger('change'), только если он изменился.

Ответ 7

Из https://api.jquery.com/change/:

Событие change отправляется элементу при изменении его значения. Это событие ограничено <input> элементами, <textarea> и <select>. Для флажков выбора, флажков и переключателей событие запускается немедленно, когда пользователь делает выбор с помощью мыши, но для других типов элементов событие откладывается до тех пор, пока элемент не теряет фокус.

Ответ 8

По состоянию на .addEventListener() 2019 года .addEventListener() в настоящее время не работает с jQuery .trigger() или .change(), вы можете проверить это ниже, используя Chrome или Firefox.

txt.addEventListener('input', function() {
  console.log('not called?');
})
$('#txt').val('test').trigger('input');
$('#txt').trigger('input');
$('#txt').change();

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="txt">

Ответ 9

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

$("#myInput").on("input", function() {
    // Print entered value in a div box
    $("#result").text($(this).val());
});