Heim > Artikel > Web-Frontend > Lösen Sie perfekt das Problem, dass die Eingabe nicht den Fokus erhalten kann, wenn die modale BootStrap-Box und select2 zusammen verwendet werden.
Die Verwendung des Select2-Plug-Ins im modalen Bootstrap-Feld führt dazu, dass das Eingabefeld in Select2 keinen Fokus und keine Eingabe erhalten kann. Wie kann dieses Problem gelöst werden? Der folgende Editor bietet Ihnen eine Lösung für das Problem, dass die Eingabe nicht den Fokus erhalten kann, wenn die BootStrap-Modalbox und select2 zusammen verwendet werden.
Die Verwendung des Select2-Plug-Ins in der Bootstrap-Modalbox führt dazu Das Problem in select2. Das Eingabefeld kann nicht fokussiert werden und kann nicht eingegeben werden.
Löschen Sie das auf der Seite (Testerfolg):
tabindex="-1"
kann in der onshown-Methode verarbeitet werden. Das Hauptprinzip besteht darin, dass
von Bootstrap die
<p id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <p class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">Panel</h3> </p> <p class="modal-body" style="max-height: 800px"> <p id="myModal" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <p class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h3 id="myModalLabel">Panel</h3> </p> <p class="modal-body" style="max-height: 800px">
tabindex='-1'
tabindex='0'
und schreiben Sie die Methode „enforceFocus“ neu (der Test ergab, dass es keine Auswirkung hat). ):
BootstrapDialog.show({ onshown: function (dialogRef) { $("#"+dialogRef.getId()).removeAttr("tabindex"); } })
Das obige ist der detaillierte Inhalt vonLösen Sie perfekt das Problem, dass die Eingabe nicht den Fokus erhalten kann, wenn die modale BootStrap-Box und select2 zusammen verwendet werden.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!