Dlaczego Zdarzenie jQuery change nie uruchamia się, gdy ustawiam wartość select za pomocą val()?

Wierzę, że można ręcznie uruchomić zdarzenie zmiany za pomocą trigger():

$("#single").val("Single2").trigger('change');

Chociaż dlaczego nie odpala automatycznie, nie mam pojęcia.

O ile mogę przeczytać w API. zdarzenie jest wywoływane tylko wtedy, gdy użytkownik kliknie na opcję.

Http://api.jquery.com/change/

Dla pól wyboru, checkboxów i przyciski radiowe, zdarzenie zostanie wywołane natychmiast, gdy użytkownik dokonuje zaznaczanie za pomocą myszki, ale dla inne typy elementów zdarzenia to odroczony do czasu, aż element straci skup się.

Dodanie tego fragmentu kodu po Val() wydaje się działać:

$(":input#single").trigger('change');

Aby to ułatwić dodaj niestandardową funkcję i wywołaj ją, gdy chcesz, aby zmiana wartości również wyzwalała zmianę

$.fn.valAndTrigger = function (element) {
    return $(this).val(element).trigger('change');
}

I

$("#sample").valAndTirgger("NewValue");

Lub możesz nadpisać funkcję val, aby zawsze wywoływać zmianę, gdy val zostanie wywołane

(function ($) {
    var originalVal = $.fn.val;
    $.fn.val = function (value) {
        this.trigger("change");
        return originalVal.call(this, value);
    };
})(jQuery);

Próbka w http://jsfiddle.net/r60bfkub/

Jeśli nie chcesz mieszać z domyślnym zdarzeniem zmiany, możesz podać swoje własne Zdarzenie

$('input.test').on('value_changed', function(e){
    console.log('value changed to '+$(this).val());
});

Aby wywołać zdarzenie na ustawionej wartości, możesz wykonać

$('input.test').val('I am a new value').trigger('value_changed');

Napotkałem ten sam problem podczas korzystania z CMB2 z WordPressem i chciałem podłączyć się do zdarzenia zmiany uploadu pliku metabox.

Więc jeśli nie jesteś w stanie zmodyfikować kodu, który wywołuje zmianę (w tym przypadku skrypt CMB2), użyj poniższego kodu. Wyzwalacz jest wywoływany po ustawieniu wartości, w przeciwnym razie twoja zmiana eventHandler będzie działać, ale wartość będzie poprzednią, a nie ustawioną.

Oto kod, którego używam:

(function ($) {
    var originalVal = $.fn.val;
    $.fn.val = function (value) {
        if (arguments.length >= 1) {
            // setter invoked, do processing
            return originalVal.call(this, value).trigger('change');
        }
        //getter invoked do processing
        return originalVal.call(this);
    };
})(jQuery);

$(":input#single").trigger('change');

$('#machineMake').val('<?php echo $_GET['headMake']; ?>').trigger('change');

I pierwsze zdarzenie zadziałało.

Jeśli właśnie dodałeś opcję select do formularza i chcesz wywołać zdarzenie change, znalazłem setTimeout jest wymagany, w przeciwnym razie jQuery nie odbierze nowo dodanego pola select:

window.setTimeout(function() { jQuery('.languagedisplay').change();}, 1);