Wie zu erkennen Materialized.js modal-closing-Ereignis?

Zu erkennen, wie die Abschlussveranstaltung für materialized.js?

Möchte ich einige JavaScript-code aus, wenn der modal verschloss sich entweder durch klicken auf die modal-Schaltfläche schließen oder drücken der escape-Taste oder Klick auf einen anderen Bereich des Bildschirms.

InformationsquelleAutor Abdul Rahman | 2015-04-21
  1. 10

    Sieht aus wie du meinst Abschlussveranstaltung für modal der materializecss Rahmen.

    Als für die version 0.97.1 (15th September, 2015), Wenn die Eröffnung eines modal, können Sie pass-Optionen (siehe: http://materializecss.com/modals.html#options), aber beachten Sie, dass es ein sehr irreführenden Beschreibung, wie die Optionen werden nicht gespeichert, wenn Sie lean_modal (https://github.com/Dogfalo/materialize/issues/1464), so dass Sie weitergegeben werden sollen, nur zu openModal.

    Zusammenfassend:

    var onModalHide = function() {
    alert("Modal closed!");
};

$("#id-of-your-modal").openModal({
    complete : onModalHide
});
    InformationsquelleAutor Jack L.
  2. 7

    Es ist einfach jetzt mit der neuesten version:

    http://materializecss.com/modals.html

    Können Sie anpassen, das Verhalten der einzelnen modalen Verwendung dieser Optionen. Zum Beispiel, können Sie eine benutzerdefinierte Funktion ausgeführt, wenn eine modale entlassen wird. Um dies zu tun, legen Sie einfach die Funktion in die Initialisierung code, wie unten dargestellt.

      $('.modal').modal({
      dismissible: true, //Modal can be dismissed by clicking outside of the modal
      ready: function(modal, trigger) { //Callback for Modal open. Modal and trigger parameters available.
        alert("Ready");
        console.log(modal, trigger);
      },
      complete: function() { alert('Closed'); } //Callback for Modal close
    }
  );

    EDIT: Ursprünglich habe ich beantwortet, es lange Zeit zurück, aber vor kurzem @JackRogers überprüft und hier ist der code, bitte verwenden Sie es, wenn es funktioniert 🙂 ich habe keine Arbeit-setup, um es zu testen.

    $('.modal').modal({
      dismissible: true, //Modal can be dismissed by clicking outside of the modal
      onOpenEnd: function(modal, trigger) { //Callback for Modal open. Modal and trigger parameters available.
        alert("Ready");
        console.log(modal, trigger);
      },
      onCloseEnd: function() { //Callback for Modal close
        alert('Closed');  
      } 
    }
  );
    • Gut, das ist sehr gut, diese Funktion wird erreicht in meinem nächsten Projekt in sha Allah. Danke, @Syed.
    InformationsquelleAutor Syed
  3. 1

    Vielleicht bin ich zu spät, um meine Gedanken zu teilen, hier aber in Fall, dass Sie wollen, übergeben Sie eine variable/argument in Ihrem Funktion Ausdruck beim modal schließen. Sie können diesen code verwenden,

    var onModalHide = function(param1) {
    alert("Modal closed!");
};

$("#id-of-your-modal").openModal({
    complete : onModalHide('your_parameter')
});

    E. g. wenn Sie zurücksetzen möchten, müssen die Felder des Formulars als Modaler schließen. Hoffe, das wird helfen. Übrigens, Dank Jack L/@Jack L. (ich weiß nicht, wie zu vergessen T. T)

    • Das funktioniert nicht, weil zusätzliche Parameter am Ende der Funktion ausgeführt, die es sofort und undefined zurückgegeben wird, statt.
    • Das ist eine wertvolle Erkenntnis! Und es ist nie zu spät 🙂
    InformationsquelleAutor S. Domeng
Schreibe einen Kommentar