ugrás a tartalomhoz

Javascript style.display='block'/'none'

GtNM · 2009. Feb. 7. (Szo), 14.13
Helló mindenkinek!
Az internetet böngészve találtam rá erre a kis scriptre,ami nagyon hasznos lenne számomra,ha megtudnám azt oldani,hogy mikor nyitva van valamelyik "pl.Teszt2 van nyitva",akkor a másikra kattintva"pl.Teszt4-re kattintunk" bezáródik az ami éppen nyitva van"a pl.-k alapján a Teszt2-ő záródna be",direkt nyílnak az ablakok egy helyen ki.
Így néz ki a kód:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Teszt</title>

<script>
function teszt(sec)
{
thisSec = eval('e' + sec);
if (thisSec != null){
if (thisSec.length){
if (thisSec[0].style.display != 'none'){
for (var i=0;i<thisSec.length;i++) {thisSec[i].style.display = 'none'}
}
else{
for (var i=0;i<thisSec.length;i++) {thisSec[i].style.display = 'inline'}
}
}
else{
if (thisSec.style.display != 'none') {thisSec.style.display = 'none'}
else{thisSec.style.display = 'inline'}
}
}

}
</script>
</head>
<body>
<a href="javascript:teszt(1)">Teszt1</a>
<a href="javascript:teszt(2)">Teszt2</a>
<a href="javascript:teszt(3)">Teszt3</a>
<a href="javascript:teszt(4)">Teszt4</a>
<div id="e1" style="position: absolute; width: 100px; height: 100px; z-index: 1; left: 425px; top: 400px;display:none;">
valami1</div>
<div id="e2" style="position: absolute; width: 100px; height: 100px; z-index: 1; left: 425px; top: 400px;display:none;">
valami2</div>
<div id="e3" style="position: absolute; width: 100px; height: 100px; z-index: 1; left: 425px; top: 400px;display:none;">
valami3</div>
<div id="e4" style="position: absolute; width: 100px; height: 100px; z-index: 1; left: 425px; top: 400px;display:none;">
valami4</div>
</body>

</html>
Ezekkel kéne próbálkoznom:
valamiOpen.style.display='block';
valamiClosed.style.display='none';
,de nem nagyon értek a Js-hez és nem tudom,hogy fűzzem össze a kódokat egymással,egy kis kiindulási segítséget szeretnék kérni,hogy melyik függvényeket/paramétereket hogy használjam itt fel,hogy ezt megtudjam oldani vagy ha már volt másnak hasonló problémája az ő megoldást is szívesen meghallgatnám,és kérlek titeket olyan választ ne adjatok,hogy álljak neki az elejétől js-t tanulni,nem hiszem,hogy hamar megtalálnám a megoldást.
‹ <script> setTimeout, target. IE 6 rosszul számolja a szélességet ›
 ■
1

egy kicsit mashogyan

nemalevi · 2009. Feb. 8. (V), 00.32

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Teszt</title>
<style type='text/css'>
span {text-decoration:underline;color:blue;cursor:pointer}
div {position: absolute; width: 100px; height: 100px; z-index: 1; left: 425px; top: 400px;display:none;}
</style>
<script>
function teszt(id) {
for(var i=1;i<=4;i++) {
var idk = 'e'+i;
if(idk == id) { document.getElementById(idk).style.display='block';} 
else { document.getElementById(idk).style.display='none'; }
 }
}
</script>
</head>
<body>
<span onclick='teszt("e1")'>Teszt1</span>
<span onclick='teszt("e2")'>Teszt2</span>
<span onclick='teszt("e3")'>Teszt3</span>
<span onclick='teszt("e4")'>Teszt4</span>
<div id="e1">valami1</div>
<div id="e2">valami2</div>
<div id="e3">valami3</div>
<div id="e4">valami4</div>
</body>
</html>
3

Univerzálisabb

inti · 2009. Feb. 20. (P), 12.08
function teszt(id)
{
    divs = document.getElementsByTagName("div");
    for (i=0;i<divs.length;i++)
    {
        if (divs[i].id == id)
        {
            divs[i].style.display = "block";
        }
        else if (divs[i].id.match(/e[0-9]+/)) 
        {
            divs[i].style.display = "none";
        }
     }
}
ui.: használjatok jQueryt :)
function teszt(id)
{
    $("div[id^=e").hide().filter("#"+id).show();
}
2

Hihi köszi szépen :D

GtNM · 2009. Feb. 8. (V), 05.18
Nagyon jól működik, tökéletes! Habár közben nekiálltam javascript-et tanulni és nem feleslegesen,mert még jobb megoldást találtam,arra amit megszerettem volna valósítani,de most ebből is felhasználok 1-2 dolgot pl.én a span-okat nem szoktam használni,de úgy látom,hogy egyszerűbb,mint az <a herf="xxx"></a>-el szórakozni...köszönöm szépen nemalevi!