Dieses Mal werde ich Ihnen die Verwendung von JS-Faltplatten ausführlich erläutern. Was sind die Vorsichtsmaßnahmen bei der Verwendung von JS-Faltplatten? Das Folgende ist ein praktischer Fall, schauen wir uns das an.
Zum Beispiel
<html> <div id="accord"> <h3>Part1</h3> <p> I am part 1</p> <h3>Part2</h3> <p>I am part 2</p> <h3>part 3</h3> <p>I am part 3</p> </div> <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"> </script> <script>$("#accord").on('click','h3',function(e){ //绑定单击事件 $(this).next().slideToggle(); //深入理解next选择器}) </script> </html>
Analyse
Der Schlüssel liegt darin, die nächste Methode zu verstehen
und die slideToggle-Methode
die sich darauf bezieht bis Das aktuelle Element h3
next wählt die benachbarten Elemente derselben Ebene aus, was nicht bedeutet, dass die Beschriftungen gleich sind. In diesem Beispiel haben p und h3 beispielsweise dieselbe Ebene
Das Obige ist eine Kettenoperation
wobei
$(this).next().slideToggle();
auch als
$(this) .next() .slideToggle();
geschrieben werden kann. Ich glaube, Sie haben die Methode nach dem Lesen des Falles gemeistert Weitere spannende Inhalte finden Sie auf der chinesischen PHP-Website anderen verwandten Artikeln!
Empfohlene Lektüre:
So sortieren Sie nach der Schlüsselwertgröße des Arrays
Laravel implementiert eine Multi- Benutzerauthentifizierungssystem
Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Verwendung von faltbaren Paneelen in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!