Bootstrap -Bestätigungsmodal löschen

Bootstrap -Bestätigungsmodal löschen

Bootstrap ist ein beliebtes Front-End-Framework, das das Design und die Entwicklung webbasierter Anwendungen vereinfacht. Insbesondere ist das Modal für Löschbestätigungsmodal eine nützliche Funktion von Bootstrap, die bereitgestellt wird. Es kann verwendet werden, um den Benutzer zur Bestätigung aufzufordern, bevor Sie etwas löschen. Dies ist eine gute Möglichkeit, versehentliche Löschungen zu vermeiden und den Benutzer über die Folgen ihrer Handlungen aufmerksam zu machen.

In diesem Artikel wird beschrieben.

So erstellen Sie einen Bootstrap -Bestätigungsmodal Löschen?

Probieren Sie die angegebenen Anweisungen aus:

  • Erstellen Sie zunächst eine Schaltfläche, die das Modalfenster auslöst. Der "Datenziel"Attribut wird der Wert zugewiesen"#DeletemodalDas zeigt auf die ID des Modals.
  • Erstellen Sie dann ein Modal mit der “modal" Und "verblassen" Klassen.
  • Der "Modal-DialogDie Klasse erstellt das Dialogfeld.
  • Dann fügen Sie das hinzu “Modal-InhaltKlasse, um Inhalte im Modal -Fenster anzugeben. Innerhalb dieser Klasse, einschließlich der Klasse “Modal-Header”.
  • Der "Modal-Header”Erstellt den Kopfzeile des modalen Fensters. Es enthält den Titel und den Schließen der Schaltfläche.
  • Erstellen Sie als nächstes den Körperabschnitt, indem Sie die Klasse als “angebenModal-Körper”. Es umfasst die Notiz, die im Dialogfeld angezeigt wird.
  • Zuletzt erstellen Sie die modale Fußzeile, indem Sie das hinzufügen “Modal-Footer" Klasse. Diese Fußzeile enthält auch zwei Tasten.

Hier ist der HTML -Code des besprochenen Szenarios:







Modal -Titel




Sind Sie sicher, dass Sie löschen möchten?









Es kann beobachtet werden, dass wir erfolgreich einen Bootstrap -Bestätigungsmodal erstellt haben:

Auf diese Weise können Sie mit Bootstrap ein Modal für Löschbestätigungsmodal erstellen.

Abschluss

Erstellen Sie zuerst eine Schaltfläche mit den Klassen, um zuerst eine Schaltfläche zu erstellen. “Btn", Und "Btn-danger"Klassen, die das modale Fenster auslösen und das Attribut hinzufügen"Datenziel”Mit dem Wert" ID "des Modals. Erstellen Sie dann das modale Fenster mit dem “modalKlasse und ID. Geben Sie dann den Inhalt des Modals mit der “anModal-Inhalt","Modal-Header","Modal-Körper", Und "Modal-Footer" Klassen. Diese Beschreibung hat gezeigt, wie Sie in Bootstrap ein Modal für Löschbestätigungsmodal erstellen.