Come cambiare elementi visualizzati

[meliupa]

Salve ragazzi, so che può essere una domanda fatta già altre volte, ma non sono riuscito a trovare la risposta che mi serve facendo la ricerca, quindi apro questa nuova discussione, per chiedere una cosa piuttosto semplice.

Io ho tre div al cui interno c'è un link, se si clikka su questo linck appare un altro div precedentemente nascosto con css display none, il punto è questo non risco a far sparire il dive aperto col primo click quando ne apro un'altro, e quindi invece di ottenere il cambio di div mi appaiono entrambi, siccome non uso jquery da parecchio tempo, non mi ricordo il comando per far accadere ciò.

Ho provato col toggle ma non va perchè si dovrebbe clikkare di nuovo sul link di apertura e non va bene perchè non da una navigazione fluida in questo modo.
e se possibile, vorrei implementare il codice corretto con ajax per non rovinare l'effetto con il ritorno della pagina aggiornata.

questo è il codice che ho usato.

$(".div1").click(function(e) {
$(".team").css("display", "block");
});
$(".div2").click(function(e) {
$("#picturt").css("display", "block");
});
$(".div3").click(function(e) {
$(".service").css("display", "block");
});

Quindi se clicco su link uno mi si apre il div team, ma poi vorrei che sparisse se clikko su div 2 sostituendo il div che appare ... questa cosa la vorrei rendere possibile per tutti e tre i link

 

[criric]

Ciao, se proprio non puoi cambiare l'html .. ad ogni click puoi far sparire tutti i div

$(".div1").click(function(e) {
       $(".div1").hide();
       $("#picturt").hide();
       $(".service").hide();
       $(".team").css("display", "block");
});

Se racchiudi il codice che posti tra i tag presenti sulla barra di formattazione ( ultimetre icone seconda linea) rendi il codice più leggibile

 

[meliupa]

In che senso cambiare ('htnl? Cosa dovrei modificare?

 

[criric]

L'hrml è il linguaggio più importante per il web.
Il lavoro principale di ogni linguaggio di programmazione (web) è produrre codice html.
più stai attento a come imposti il codice html meno codice javascipt ( in questo caso ) è necessario.
Ti faccio un esempio veloce

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script>
    $(document).ready(function(){
        $(".link").click(function() {
            $(".div").hide();
            $("#" + $(this).attr("href")).show();
            return false;
        });
    });
    
</script>
<style>
    .div {
        display: none;
    }
</style>
<a class="link" href="div1"> div 1</a>
<a class="link" href="div2"> div 2</a>
<a class="link" href="div3"> div 3</a>
<div class="div" id="div1">DIV 1</div>
<div class="div" id="div2">DIV 2</div>
<div class="div" id="div3">DIV 3</div>

ogni div ha la stessa classe, ma , un id diverso.

 

[meliupa]

Ah ook...ci avevo pensato... grazie mille