Vysvětlení kodu Accordion – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu
Reklama

Vysvětlení kodu Accordion – JavaScript, AJAX, jQuery – Fórum – Programujte.comVysvětlení kodu Accordion – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 
Hledat
Moderní platforma pro vytvoření vašeho nového webu – Wix.com.
Nyní už můžete mít web zdarma.
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno
Laser Game Ostrava

shockwave
~ Anonymní uživatel
46 příspěvků
30. 4. 2019   #1
-
0
-

Ahoj, popsal by mi trošku někdo znalý tento kod: je to klasická rozbalovací webová harmonika, proč tu použili for

Děkuji za pomoc...


<script>
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click", function() {
    this.classList.toggle("active");  /??
    var panel = this.nextElementSibling; /??
    if (panel.style.display === "block") {
      panel.style.display = "none";
    } else {
      panel.style.display = "block";
    }
  });
}
</script>
 

Nahlásit jako SPAM
IP: 212.4.155.–
gna
~ Anonymní uživatel
902 příspěvků
30. 4. 2019   #2
-
0
-

Protože to dělá pro všechny prvky.

for (i = 0; i < acc.length; i++) {
  acc[i].addEventListener...
Nahlásit jako SPAM
IP: 213.211.51.–
peter
~ Anonymní uživatel
3497 příspěvků
2. 5. 2019   #3
-
0
-

var acc = document.getElementsByClassName("accordion");
get-Elements!-By-Class-Name
acc = [element, element, element]

for (i = 0; i < acc.length; i++)
element =  acc[I]

acc[i].addEventListener("click", function()
element.addEventListener("click", funkceX);

---

function funkceX()
{
this.classList.toggle("active");  // element.addEventListener("click", funkceX); // this = element, kde byla pozice mysi, kdyz nastala event udalost (stisk klavesy, mys tlacitka, pohyb mysi)
    var panel = this.nextElementSibling; // googlem
}

google = nextElementSibling
https://developer.mozilla.org/…ementSibling
Jestli to spravne chapu, tak to da dalsi element ve stromu na stejnem levelu zanoreni.
Nevim, co predstavuje pojem webova harmonika, ale ten kod by mohl zobrazit 1 dalsi div pod divem, na ktery jsi klikl.
Cili, kdyz mas strukturu 

<div class=accordion>tlacitko</div>
<div><ul class=list_links><li><li><li></ul></div>
<div class=accordion>tlacitko</div>
<div><ul class=list_links><li><li><li></ul></div>

tak by to melo vzdy sbalit a rozbalit menu.

Misto getElementsByClassName se da pouzivas nove querySelector('.accordion')

Nahlásit jako SPAM
IP: 2001:718:2601:258:4dbc:3838:5a25:f2e0...–
Zjistit počet nových příspěvků

Přidej příspěvek

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 7 hostů

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032019 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý