Autor Zpráva
tomsonrecord
Profil
Dobrý den, používám pro zobrazování a skrývání odstavce následující javaskript. Potřeboval bych prosím poradit s úpravou tohoto skriptu pro následující možnost: při kliknutí na „Nadpis skrývaného odstavce“ se odkryje <div id="idecko"> a zároveň by se změnila třída nadpsisu, po znovuzakliknutí se se odstavec skryje a třída nadpsisu se vrátí do původního stavu.
<script>
  function zobrazSkryj(idecko){
  el=document.getElementById(idecko).style; 
  el.display=(el.display == 'block')?'none':'block';
  }
</script>

<h3 onclick="zobrazSkryj('idecko')">Nadpis skrývaného odstavce</h3>
<div id="idecko" class="skryvany">
<p>skryvany odstavec</p>
</div>
Teprve se s javaskriptem začínám kamarádit, prosím porot i o konkrétní pomoc. Děkuji.
P.S: zkoušel jsem javaskript upravovat dle jiných rad z fóra, ale neměl jsem úspěch.
_es
Profil
tomsonrecord:
Použi vlastnosť className.
tomsonrecord
Profil
_es:
Děkuji za nasměrování. Po dlouhém trápení mi toto funguje takto:
<script>
  function zobrazSkryj(idecko){
  el=document.getElementById(idecko).style; 
  el.display=(el.display == 'block')?'none':'block';
  document.getElementById('idecko2').className = (document.getElementById('idecko2').className == 'cervena')?'nic':'cervena';
  }
</script>
<div id="idecko2"> 
<h3 class="nic" onclick="zobrazSkryj('idecko')">Nadpis skrývaného odstavce</h3>
</div>
<div id="idecko" class="skryvany">
<p>skryvany odstavec</p>
</div>

Nedalo by se zbavit toho obalovacího divu idecko2 ? Bohuzel mi to nejde. Dekuji.
tomsonrecord
Profil
Nakonec jsem to nechal takto:
<script>
  function zobrazSkryj(idecko){
  el=document.getElementById(idecko).style; 
  el.display=(el.display == 'block')?'none':'block';
  }
</script>
<span class="nic" onclick="this.className=this.className=='cervena'?'nic':'cervena';">
<h3 id="idecko2" onclick="zobrazSkryj('idecko')">Nadpis skrývaného odstavce</h3>
</span>
<div id="idecko" class="skryvany">
<p>skryvany odstavec</p>
</div>

je to v pohode obalit nadpis ještě spanem a dát mu onclick="this.className=this.className=='cervena'?'nic':'cervena';" neslo by to udelat v ramci funkce zobrazSkryj? Dík
juriad
Profil
Nejlepším řešením je asi přímo obsah neskrývat, ale přiřadit celému „článku“ třídu která skrytí zajistí. Zároveň se postará i o obarvení nadpisu.
Ukázka: http://kod.djpw.cz/bvb
Jak vidíš, javascript je pořád triviální, veškerá „logika“ se přesunula do CSS.
Změněno použití metody contains za indexOf
_es
Profil
juriad:
Metódu contains na textových reťazcoch podporuje iba Firefox: dokumentácia Mozilly. Okrem toho, v tvojom JS kóde je tá „logika“ akási neprehľadná a na pohľad „divná“.
juriad
Profil
_es:
Díky za metodu indexOf. Delší dobu jsem v JS neprogramoval a neověril jsem si to.
Ta funkce jen simuluje classList, který snad budeme moci v budoucnu používat. Pak by můj kód obsahoval jedinou řádku (volání toggle).

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: