Cómo activar el evento de cambio de jQuery en el código

177

Tengo un evento de cambio que funciona bien pero necesito que vuelva a aparecer.

Por lo tanto, tengo una función que se activa en el cambio que "cambiará" otros menús desplegables en función de un selector de clase (observe "menús desplegables S", podría haber más de uno). Este cambio de proxy no activa la función y falla. ¿Cómo puedo hacer que funcione?

Código

$(document).ready(function () {
    var activeDropBox = null;

    $("select.drop-box").change(function () {
        var questionId = $(this).attr("questionId");
        var selectedAnswer = $(this).val();
        activeDropBox = this;

        alert(this.questionId);

        $.ajax(
        {
            type: "POST",
            url: answerChangedActionUrl,
            data: { questionId: questionId, selectedValue: selectedAnswer },
            success: function (data) {
                SetElementVisibility(data.ShowElement, questionId);
            }, error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert('XMLHttpRequest:' + XMLHttpRequest.responseText);
                alert('textStatus:' + textStatus);
                alert('errorThrown:' + errorThrown);
            }
        });
    });

    function SetElementVisibility(visible, questionId) {
        // I would like each child to then trigger the change event...
        $(".childOf" + questionId)[visible ? 'show' : 'hide']('slow');

        // Suggested code
        //$(".childOf" + questionId + " select").trigger("change");

        if (!visible) {
            $(".childOf" + questionId + " select").attr('selectedIndex', 0);
        }
    }
}

Las sugerencias hasta ahora parecen funcionar, pero a medida que el evento de cambio desencadena una publicación ajax, ahora parece fallar aquí. Voy a jugar con eso, pero eso es algo para otra pregunta que siento.

javascript jquery javascript-events

— 4imble
fuente

1

Proporcione un código para que podamos echar un vistazo

— Alex Rashkov

¿Cómo podemos decirle cómo hacer que funcione, cuando no nos ha mostrado lo que es?

— user113716

1

Pensé que era un concepto simple y no sentí que se requería código. Las respuestas hasta ahora parecen haber entendido mi explicación y ahora estoy probando sus soluciones. Si no tengo ninguna alegría, publicaré un código. Mi implementación es en realidad mucho más compleja.

— 4imble

1

Lo solucioné, fue un problema para mí cambiar el valor después de la publicación ajax. Gracias por toda la ayuda. Las sugerencias publicadas funcionaron como un encanto.

— 4imble

391

Use el método trigger ()

$(selector).trigger("change");

— John Hartsock
fuente

44

¿Hay algún beneficio para esto change()? ¿O es solo preferencia?

— Joshua Pinter

66

@JoshPinter sin beneficio real, más una preferencia. Pero definitivamente es más fácil de abstraer como parámetro que como nombre de método.

— John Hartsock

¡Establecer un valor antes de activar el evento de cambio es la mejor manera!

— Kapil Yadav

33

para mi $('#element').val('...').change()es la mejor manera.

— Luis Carlos Steffens
fuente

¡Sí !, me gusta este

— Juan Herrera

¡Si! Permite elegir la opción al mismo tiempo. Creo que tu respuesta merece ser la mejor aquí.

— Sergej Fomin

20

La forma sin parámetros del método change () desencadena un changeevento. Puedes escribir algo como:

$(document).ready(function() {
    $("#yourInitialElementID").change(function() {
        // Do something here...
        $(".yourDropDownClass").change();
    });
});

— Frédéric Hamidi
fuente

9

$(selector).change()

.cambio()

.trigger ("cambio")

Alternativa más larga y lenta , mejor para la abstracción.

.trigger ("cambio")

$(selector).trigger("change")

— Geoffrey Hale
fuente

8

Usa eso :

$(selector).trigger("change");

O

$('#id').trigger("click");

O

$('.class').trigger(event);

Trigger puede ser cualquier evento que soporte JavaScript. Espero que sea fácil de entender para todos ustedes.

— Muhammad Fahad
fuente