Verhindern des Schließens von Dropdown-Menüs bei internen Klicks
Um zu verhindern, dass Twitter Bootstrap-Dropdown-Menüs geschlossen werden, wenn auf ein internes Element geklickt wird, eine Lösung, die dies umgeht Die delegierte Klickereignisbehandlung ist erforderlich. Hier ist eine ausführliche Erklärung und ein Lösungsvorschlag:
Standardmäßig werden die Dropdown-Menüs von Twitter Bootstrap bei jedem Klick geschlossen, auch innerhalb des Menüs selbst. Um dieses Verhalten zu überwinden, besteht ein gängiger Ansatz darin, einen Click-Event-Handler an das Dropdown-Menü anzuhängen und event.stopPropagation() aufzurufen, um die Ereignisweitergabe zu verhindern.
Bei Setups, die Komponenten wie Karussellsteuerungen verwenden, ist jedoch das delegierte Ereignis Der Verarbeitungsmechanismus von Twitter Bootstrap kann das beabsichtigte Verhalten beeinträchtigen. In solchen Fällen löst das Klicken auf diese Steuerelemente möglicherweise nicht die erwartete Aktion aus, da das Ereignis die delegierten Ereignishandler nicht erreicht.
Das Verlassen auf Dropdown-Ereignisse zum Ausblenden/Ausblenden ist keine praktikable Alternative, da diesen Ereignissen wesentliche Informationen fehlen Kontrolle über den Dropdown-Inhalt.
Vorgeschlagene Lösung
Eine effektive Lösung besteht darin, die Ereignisdelegation für ein Containerelement zu verwenden, das das Dropdown-Menü enthält. Hier ist ein Beispiel:
<code class="js">$(document).on('click', 'someyourContainer .dropdown-menu', function (e) { e.stopPropagation(); });</code>
In diesem Beispiel wird das Ereignis durch Klicken auf Elemente innerhalb des angegebenen Containers weiterhin an die jeweiligen delegierten Handler weitergegeben. Klicks speziell auf das Dropdown-Menü werden jedoch abgefangen und event.stopPropagation() verhindert das Schließverhalten des Dropdown-Menüs.
Das obige ist der detaillierte Inhalt vonWie kann verhindert werden, dass Twitter-Bootstrap-Dropdown-Menüs bei internen Klicks geschlossen werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!