| Autor | Zpráva | ||
|---|---|---|---|
| Petr-K Profil * |
#1 · Zasláno: 4. 5. 2010, 22:13:15
Zdravím,
požívám na skrytí a zobrazení textu kód, který jsem kdysi dávno sehnal zde v nějakém vlákně. Dnes jsem se k němu vracel, ale zjistil sem, že neumí jednu věc, kterou potřebuji. JS moc neovládám, tak se obracím na vás... mám: function ShowInvisible(id){
var tab = document.getElementById('invisible_'+id);
if(tab.style.display=="none"){
tab.style.display="";
}else{
tab.style.display="none";
}
}a <span id="invisible_1" style="display:none;">text</span> <span id="invisible_1" style="display:none;">text 2</span> <a href="#" onclick="ShowInvisible(1); return false;">ukaz text >>></a> A jedná se o to, že potřebuji jedním klikem zobrazit oba skryté texty. Takto se mi zobrazuje jen ten první. Může mi někdo poradit jak to jde vyřešit? Děkuji. |
||
| Joker Profil |
#2 · Zasláno: 4. 5. 2010, 22:30:26
Petr-K:
ID prvku nemůže být duplicitní, tj. na stránce může být jen jeden prvek s daným ID. Možnost je dát jim id třeba invisible_1 a invisible_2 a pak volat ShowInvisible(1); ShowInvisible(2);
|
||
| __construct Profil |
#3 · Zasláno: 4. 5. 2010, 22:36:05
Joker:
Pomohlo by keby namiesto ID použil class a v JS getElementsByClassName ? |
||
| Chamurappi Profil |
#4 · Zasláno: 4. 5. 2010, 22:48:09
Reaguji na __constructa:
Moc ne, protože getElementsByClassName má slabou podporu, jak už ti bylo jednou řečeno.
|
||
| Joker Profil |
#5 · Zasláno: 4. 5. 2010, 22:50:36
__construct:
„Pomohlo by keby namiesto ID použil class a v JS getElementsByClassName ?“ To by sice šlo, ale musel by si napsat getElementsByClassName (alespoň pro prohlížeče, které to nepodporují). |
||
| Petr-K Profil * |
#6 · Zasláno: 4. 5. 2010, 23:26:55
Chamurappi
Jak je myšleno "Moc ne, protože getElementsByClassName má slabou podporu"? Jiný kód na podobný problém jste v minulosti nikdo nepoužíval? |
||
| Trejpa Profil |
#7 · Zasláno: 4. 5. 2010, 23:56:33
Petr-K:
<script>function schovat(co){document.getElementById(co).style.display=document.getElementById(co).style.display=='block'?'none':'block';}</script>
<a href="#" onclick="schovat('invisible_1'); return false">zobrazit / skrýt invisible_1</a>
<div id=invisible_1>schovávaný obsah 1</div>
<div id=invisible_2>schovávaný obsah 2</div>
<a href="#" onclick="schovat('invisible_2'); return false">zobrazit / skrýt invisible_2</a>V případě řádkových elementů nahraď 'block' za 'inline'. |
||
| Chamurappi Profil |
#8 · Zasláno: 5. 5. 2010, 12:49:30
Reaguji na Petra-K:
„Jiný kód na podobný problém jste v minulosti nikdo nepoužíval?“ Tvůj kód je použitelný, stačí provést úpravy, které zmínil Joker. Reaguji na Jokera: „ID prvku nemůže být duplicitní“ Může, ale nesmí :-) Pokud je víc stejných ID, vrací document.getElementById první výskyt.
Reaguji na Trejpu: Objekt element.style pracuje pouze s atributem style. To znamená, že pokud ty <div>y nemají explicitně uvedený style="display: block", vrátí u nich element.style.display prázdný řetězec — při prvním volání funkce schovat tedy nedojde ke skrytí, jelikož se ternární operátor vyhodnotí negativně.
„V případě řádkových elementů nahraď 'block' za 'inline'.“ Obecnější je nenastavovat žádnou konkrétní hodnotu, ale zrušit skrývající style="display: none" tím, že do element.style.display přiřadí prázdný řetězec (za předpokladu, že skrytí neřídí stylopisem).
A úplně nejobecnější je měnění třídy. |
||
| Petr-K Profil * |
#9 · Zasláno: 5. 5. 2010, 15:08:43
Trejpa
to se chová ale uplně stejně jako ten původní kód. Zase se zobrazí jen jedno skryté ID. |
||
| Petr-K Profil * |
#10 · Zasláno: 5. 5. 2010, 15:11:48
Chamurappi
jj, prozatím jsem to udělal tak jak poradil Joker, ale i tak by bylo určitě lepší mít jiný kód, kde nemusím uvádět x různých IDéček. Každopádně díky za tipy. |
||
| panther Profil |
#11 · Zasláno: 5. 5. 2010, 15:17:55
Petr-K:
„ale i tak by bylo určitě lepší mít jiný kód, kde nemusím uvádět x různých IDéček.“ a jak by pak podle tebe ten kód měl fungovat? Měl by si prohlížeš tipnout, jaký prvek jsi chtěl skrýt, když nebude jednoznačně určen IDčkem? |
||
| Petr-K Profil * |
#12 · Zasláno: 5. 5. 2010, 15:44:24
Proč by měl tipovat? Myslel jsem že v JS jde ovlivňovat určitou skupinu prvnů - kteráje stejně označena - jedním klikem...
|
||
| Chamurappi Profil |
#13 · Zasláno: 5. 5. 2010, 16:06:21
Reaguji na Petr-Ka:
A ty chceš skrýt celou skupinu <div>ů naráz? To jsi nena… aha, to jsi vlastně napsal :-)
Měň třídu společnému rodiči a (ne)viditelnost urči ve stylopisu. Třídu změníš nějak takto: document.getElementById("ídéčko-společného-rodiče").className = "nová třída"; |
||
| Petr-K Profil * |
#14 · Zasláno: 5. 5. 2010, 16:45:10
Chamurappi:
můžeš mi prosím víc napovědět... :) co se týká JS tak jsem spíše "lepič kódu" :) |
||
|
Časová prodleva: 5 dní
|
|||
| peta Profil |
#15 · Zasláno: 10. 5. 2010, 15:37:00
Petr-K: chjooo :)
JS m = document.getElementById('menu'); m.className = 'schovat'; CSS .schovat A {display:none;} HTML <div id="menu"> <a href="#">aaa</a> <a href="#">aaa</a> </div> Ovlivnujes skupinu prvku A ve vsem, co je v div id=menu zmenou jeho class parametru. Rodic, nadrazeny prvek prvku A je DIV. To tim chtel rici. getElementsByClassName Je a neni podporovany, zalezi na prohlizeci, urcite FF, mozna IE8, mozna opera, mozna chrome. Vyzkousej, ja preferuji FF a castecne IE, ostatni prohlizece se vetsinou chovaji uz podobne jako tyto dva. Googlem lze najit nahradu teto funkce prepsanou do prototype. Googlem lze naji jquery knihovnu, ktera muze obsahovat tuto nahradu. Nevim, nezkoumal jsem. |
||
| Bubák Profil |
#16 · Zasláno: 10. 5. 2010, 23:13:02
peta:
Tys to nezkoumal ani ve svém preferovaném FF, tvá slátanina nefunguje. |
||
|
Časová prodleva: 14 let
|
|||
0