Wie kann ich Remote-Inhalte in Bootstrap 4 Modal laden?

Laden von Remote-Inhalten in Bootstrap 4 Modal

Die Einführung von Bootstrap 4 bringt eine wesentliche Änderung an der Remote-Datenladefunktion in Modal mit sich. Im Gegensatz zu Bootstrap 3 lehnt Bootstrap 4 die Remote-Option ab und verweist auf die Empfehlung zur Verwendung von clientseitigen Vorlagen oder Datenbindungs-Frameworks.

Problem mit Bootstrap 4 Modal erkannt:

Benutzer haben von Problemen beim Laden von Remote-Inhalten in Modal mit der neuen Bootstrap 4 Alpha-Version berichtet. Während das Popup-Fenster angezeigt wird, bleibt der Modellkörper leer, was darauf hinweist, dass die Anforderung zum Laden von Inhalten von der angegebenen URL nicht erfolgt.

Lösung mit jQuery:

Um die Remote-Loading-Funktionalität wiederherzustellen, können Sie sie manuell mit implementieren jQuery:

$('body').on('click', '[data-toggle="modal"]', function(){
        $($(this).data("target")+' .modal-body').load($(this).data("remote"));
    });  

Erklärung

Diese Lösung verwendet die Methode „load()“ von jQuery, um den Inhalt von der angegebenen Remote-URL dynamisch in das .modal-body-Element von zu laden das gezielte Modal. Der Click-Event-Listener ist mit dem Attribut data-toggle="modal" an alle Elemente gebunden und stellt so sicher, dass die Funktionalität auf alle Modals in Ihrer Anwendung angewendet wird.

Das obige ist der detaillierte Inhalt vonWie kann ich Remote-Inhalte in Bootstrap 4 Modal laden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!