Ausführliche Erläuterung zur Verwendung der modalen Bootstrap-Box

Modal ist ein Unterformular, das das übergeordnete Formular abdeckt. Typischerweise besteht der Zweck darin, Inhalte aus einer separaten Quelle anzuzeigen, die eine gewisse Interaktion ermöglichen, ohne das übergeordnete Formular zu verlassen. Unterformulare bieten Informationen, Interaktion und mehr. Standardmäßig wird das Bootstrap-Modalfeld durch Klicken auf andere leere Bereiche (normalerweise die Maskenebene) geschlossen. Daher besteht die folgende Methode darin, das Klicken auf andere Bereiche zum Schließen des Modalfelds zu verhindern.

$('#myModal').modal({backdrop: 'static', Keyboard: false});

Bei Sicherung: statisch wird der Leerraum nicht geschlossen.

keyboard:false, wird die Esc-Tastatur nicht geschlossen.

Der obige Code wird auch zum Öffnen der Modalbox verwendet.

Sie können auch die folgende Methode verwenden:

<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
 <div class="modal-dialog custom-dialog succ-dialog">
 <div class="modal-content">
  <div class="modal-header">
  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
  <h4>提示信息</h4>
  </div>
  <div class="modal-body">
  <div><img src="images/loading.gif"><p><span>投标成功！</span><img src="images/success.png"></p></div>
  </div> 
 </div>
 </div>
</div>

Der data-backdrop="static" gibt hier einen statischen Hintergrund an, der das modale Feld nicht schließt, wenn der Benutzer außerhalb des klickt Modalbox. Datentastatur bezieht sich auf das Schließen des Modalfelds, wenn die Escape-Taste gedrückt wird. Wenn sie auf „false“ gesetzt ist, ist die Taste ungültig.

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung zur Verwendung der modalen Bootstrap-Box. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!