Struktur:
.parent (has if/else to toggle on click) -> .child (has nothing)
Das übergeordnete Element wird so formatiert, dass überfüllter Inhalt ausgeblendet wird und die Höhe bei Klick umgeschaltet wird. Wenn der Benutzer klickt, wird das übergeordnete Element erweitert, um das untergeordnete Element anzuzeigen. Ich möchte, dass Benutzer auf das untergeordnete Element klicken können, ohne dass das übergeordnete Element wieder auf seine ursprüngliche Größe wechselt und das untergeordnete Element ausgeblendet wird. Ich möchte, dass die Umschaltung nur auf dem Elternelement stattfindet.
Ich stelle fest, dass das Kindelement immer noch im anklickbaren Bereich des Elternelements enthalten ist, aber gibt es eine Möglichkeit, es auszuschließen?
Lösung 1: Vergleiche target mit currentTarget:
%Vor% e.target ist das Element, das das Ereignis gestartet hat.
e.currentTarget wird dort sein, wo es gerade ist (sprudelnd), was parentEle in diesem Klick-Ereignis ist, da dies das ist, worauf es ankommt.
Wenn sie identisch sind, wissen Sie, dass der Klick direkt auf dem übergeordneten Element erfolgt ist.
Lösung 2: Stoppen Sie die Weitergabe, bevor das Ereignis die parentEle trifft:
Die andere Möglichkeit besteht darin, zu verhindern, dass das Ereignis an der ersten Stelle aufblubst, wenn auf ein untergeordnetes Element geklickt wird. Das kann so gemacht werden:
%Vor% Der Hauptunterschied zwischen den beiden ist, dass die erste Lösung das Ereignis in diesem Listener einfach ignoriert und es erlaubt, dass es weiter sprudelt. Dies kann erforderlich sein, wenn Sie ein Elternteil dieses parentEle haben, das das Ereignis abrufen muss.
Die zweite Lösung verhindert, dass Klickereignisse über die direkten Kinder von parentEle hinaus blubbern. Wenn also ein click -Ereignis für einen Elternteil von parentEle vorhanden wäre, würden sie diese Ereignisse auch nicht sehen.
Tags und Links javascript html jquery dom javascript-events