| Autor | Zpráva | ||
|---|---|---|---|
| JS king Profil * |
#1 · Zasláno: 5. 11. 2010, 16:49:42
spravil som primitivny program v JS, kde chcem prepinat cez taby contet...
<div id="pos1"> <div id="con1">Con1</div> <div id="con2">Con2</div> <div id="con3">Con3</div> <div id="right"> <div id="tab1"><a href="javascript:tab1();">Klik1</a></div> <div id="tab2"><a href="javascript:tab2();">Klik2</a></div> <div id="tab3"><a href="javascript:tab3();">Klik3</a></div> </div> <div class="clr"></div> </div> function tab1() {
var con1, con2, con3, tab2;
con1 = document.getElementById("con1");
con2 = document.getElementById("con2");
con3 = document.getElementById("con3");
tab2 = document.getElementById("tab2");
if(tab1) {
con2.style.display="none";
con1.style.display="block";
con3.style.display="none";
}
}
function tab2() {
var con1, con2, con3, tab2;
con1 = document.getElementById("con1");
con2 = document.getElementById("con2");
con3 = document.getElementById("con3");
tab2 = document.getElementById("tab2");
if(tab2) {
con2.style.display="block";
con1.style.display="none";
con3.style.display="none";
}
}
function tab3() {
var con1, con2, con3, tab2;
con1 = document.getElementById("con1");
con2 = document.getElementById("con2");
con3 = document.getElementById("con3");
tab2 = document.getElementById("tab2");
if(tab3) {
con2.style.display="none";
con1.style.display="none";
con3.style.display="block";
}
}toto funguje... ale skor som to skusal takto: function tabs() {
var con1, con2, con3, tab1, tab2, tab3;
con1 = document.getElementById("con1");
con2 = document.getElementById("con2");
con3 = document.getElementById("con3");
tab1 = document.getElementById("tab1");
tab2 = document.getElementById("tab2");
tab3 = document.getElementById("tab3");
if(tab2) {
con2.style.display="block";
con1.style.display="none";
con3.style.display="none";
}
if(tab3) {
con3.style.display="block";
con1.style.display="none";
con2.style.display="none";
}
}ale ci kliknem na Kli1, alebo klik2 aebo klik3 furt mi to da len con3 div... neviete preco? vdaka za radu. |
||
| Darker Profil |
#2 · Zasláno: 5. 11. 2010, 17:32:15 · Upravil/a: Darker
Máš to hrozně neefektivní. S dovolením skript zkrátím:
function tabSwitch(tab) {
document.getElementById("con1").style.display="none";
document.getElementById("con2").style.display="none";
document.getElementById("con3").style.display="none";
document.getElementById("tab2").style.display="none";
document.getElementById(tab).style.display="block";
}
Daleko lepší řešení je pomocí cycklu, ale to bys, soudě podle tvého výtvoru, nepochopil Následuje HTML: <div id="pos1">
<div id="con1">Con1</div>
<div id="con2">Con2</div>
<div id="con3">Con3</div>
<div id="right">
<div id="tab1"><a href="javascript:tabSwitch(this.id);">Klik1</a></div>
<div id="tab2"><a href="javascript:tabSwitch(this.id);">Klik2</a></div>
<div id="tab3"><a href="javascript:tabSwitch(this.id);">Klik3</a></div>
</div>
<div class="clr"></div>
</div>Správnější by asi taky bylo pracovat s objektem než ID ale to je také fuk... |
||
| JS king Profil * |
#3 · Zasláno: 5. 11. 2010, 20:18:10
Darker:
jo tak by sa to tiez dalo, ale nevyriesil si predmet temy. - Daleko lepší řešení je pomocí cycklu, ale to bys, soudě podle tvého výtvoru, nepochopil Myslis? Skus a ja ti poviem ci som to pochopil alebo nie. |
||
| Chamurappi Profil |
#4 · Zasláno: 5. 11. 2010, 20:34:02
Reaguji na JS kinga:
Nazvat si proměnné přesně stejně jako názvy funkcí je hloupé, protože sdílejí stejný prostor názvů a musíš si dávat pozor, kdy je tab2 funkce a kdy je to <div>.
Stejně tak není příliš prozíravé nazývat funkce v JS stejně jako jsou id elementů ve stránce.
Když koukám na tvůj první kód: 9: „if(tab1) {“ Co si myslíš, že dělá tahle podmínka? Kontroluje, jestli je v proměnné tab1 něco pravdivého (nenulového), což vždy je — je tam celá funkce tab1.
24: „if(tab2) {“ V tab2 je pro změnu objekt <div id="tab2">, pokaždé. Podmínka je opět splněna vždy.
Stejně tak v druhém uváděném kódu dáváš do proměnných tab1 až tab3 vyhledané HTML elementy… a pak také zkoumáš, jestli existují?
Na tvém místě bych to vyřešil jinak. Odkazům bych dal takovýto skript: <a href="javascript:void(document.getElementById('pos1').className = 'selN')">KlikN</a> (za N si doplň 1, 2, 3)
… a ve stylech bych se postaral o to, aby v závislosti na nastavené třídě selN na elementu s id="pos1" byla část potomků skrytá.
Reaguji na Darkera: „<a href="javascript:tabSwitch(this.id);">“ Nepůjde, window nemá id :-)
I kdyby to byl onclick, tak dotyčné <a> nemá id.
|
||
| JS king Profil * |
#5 · Zasláno: 6. 11. 2010, 15:30:36
Chamurappi:
Ne. Ja som skor za externy subor. Nemam rad ked sa take dlhe scripty vkladaju rovno do html.... |
||
| Chamurappi Profil |
#6 · Zasláno: 6. 11. 2010, 17:53:33
Reaguji na JS kinga:
„Nemam rad ked sa take dlhe scripty vkladaju rovno do html“ Tak si ten jeden jediný řádek dej do funkce (kde selN bude argument), tu do externího souboru a volej ji.
Proč to nemáš rád? Proč ti ten skript připadá dlouhý? |
||
|
Časová prodleva: 15 let
|
|||
0