So lösen Sie ein jQuery-Änderungsereignis im Code aus

177

Ich habe ein Änderungsereignis, das gut funktioniert, aber ich muss es wiederkehren lassen.

Ich habe also eine Funktion, die bei einer Änderung ausgelöst wird und andere Dropdowns basierend auf einem Klassenselektor "ändert" (beachten Sie "Dropdowns", es kann mehr als eine geben). Diese Proxy-Änderung löst die Funktion nicht aus und schlägt daher fehl. Wie kann ich es zum Laufen bringen?

Code

$(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);
        }
    }
}

Die bisherigen Vorschläge scheinen zu funktionieren, aber da das Änderungsereignis einen Ajax-Beitrag auslöst, scheint es hier jetzt zu scheitern. Ich werde damit herumspielen, aber das ist etwas für eine andere Frage, die ich fühle.

4imble
quelle
1
Geben Sie einen Code ein, damit wir einen Blick darauf werfen können
Alex Rashkov
Wie können wir Ihnen sagen, wie Sie es zum Laufen bringen können, wenn Sie uns nicht gezeigt haben, was es ist?
user113716
1
Ich dachte, es sei ein einfaches Konzept und hielt Code nicht für erforderlich. Die bisherigen Antworten scheinen meine Erklärung verstanden zu haben, und deshalb versuche ich jetzt, ihre Lösungen zu finden. Wenn ich keine Freude habe, werde ich einen Code posten. Meine Implementierung ist tatsächlich viel komplexer.
4imble
1
Sortiert, war ein Problem, als ich den Wert nach dem Ajax-Post änderte. Vielen Dank für die Hilfe. Die geposteten Vorschläge wirkten wie ein Zauber.
4imble

Antworten:

390

Verwenden Sie die Methode trigger ()

$(selector).trigger("change");
John Hartsock
quelle
4
Gibt es einen Vorteil dafür change()? Oder ist es nur Präferenz?
Joshua Pinter
6
@JoshPinter kein wirklicher Vorteil, eher eine Präferenz. Aber als Parameter definitiv einfacher zu abstrahieren als als Methodenname.
John Hartsock
Das Festlegen eines Werts vor dem eigentlichen Auslösen eines Änderungsereignisses ist der beste Weg !!
Kapil Yadav
33

für mich $('#element').val('...').change()ist der beste weg.

Luis Carlos Steffens
quelle
Ja!, Ich mag dieses
Juan Herrera
Ja! Es ermöglicht die gleichzeitige Auswahl der Option. Ich denke, Ihre Antwort verdient es, hier die beste zu sein.
Sergej Fomin
20

Die parameterlose Form der change () -Methode löst ein changeEreignis aus. Sie können so etwas schreiben wie:

$(document).ready(function() {
    $("#yourInitialElementID").change(function() {
        // Do something here...
        $(".yourDropDownClass").change();
    });
});
Frédéric Hamidi
quelle
8

Verwende das :

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

ODER

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

ODER

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

Auslöser kann jedes Ereignis sein, das Javascript unterstützt. Ich hoffe, es ist für Sie alle leicht verständlich.

Muhammad Fahad
quelle