box javascript

[rash]

Ciao a tutti, ho un piccolo problemino riguardante una funzione in javascript che mi determina l'apertura di un box al di sotto di alcuni div e che mostra delle altre informazioni.

Il problema è che una volta che il box è aperto e cambio pagina tornando indietro attraverso le frecce del browser il box ritorna chiuso.

So che è logico che ritorni chiuso, ma potreste consigliarmi qualche modo per rimanerlo aperto?

Premetto che in locale il box rimane aperto, una volta che pubblico il sito ho questo problema.

la funzione è questa:

<script>
   function showonlyone(thechosenone) {
     $('.box_sottocategorie').each(function(index) {
      if ($(this).attr("id") == thechosenone) {
      $(this).fadeIn('slow');
      }
      else {
         $(this).hide();  
            }
     });
   }
</script>

e per aprire questo dannato box chiamo la funzione:

<a href="javascript:showonlyone('box');></a>

che mi apre il div in questione:

<div class="box_sottocategorie" id="box">

Grazie mille in anticipo a chi mi aiuterà

[mariolone]

La prima soluzione che mi salta in mente è lavorare con i cookies: http://www.w3schools.com/js/js_cookies.asp
ciao

[SimoX90]

Usare un cookie non è una soluzione mi sa, perché quando torni indietro il browser non rigenera la pagina...
una soluzione (HTML5+Jquery) è utilizzare l'API History, e associare a ciascun div una querystring nell'url GET, ovvero un link univoco.
http://diveintohtml5.info/history.html

nell'onclick fai un history.replaceState('vedi documentazione^'); (qui è MOLTO OPPORTUNO controllare se history.ecc... è una funzione, altrimenti i vecchi browser fan casino if(typeof history.replaceState =="function")...)

e poi

$(window).bind("popstate", function(e) {    if(???){//vedi sotto
        onurlchange();//mia funzione che simula il click sul pulsante appropriato
    }else{
        ...
    }
});

per intercettare l'evento della pressione del tasto indietro (in realtà intercetti il cambio di url, quindi devi controllare che questo non sia appena stato modificato da te (io uso una variabile globale bool)


Ciao!

[rash]

Grazie mille innanzitutto.
Effettivamente i coockie sono utili se la pagina viene ricaricata nel mio caso purtoppo parliamo dei pulsantini avanti e indietro del browser dove non viene caricata la pagina.

Per quanto riguarda l'history.replaceState non mi è molto chiaro come dovrei operare.
Ho provato a scrivere l'url con un cancelletto #open, ma non riesco a capire come dire al browser "se torna indietro col browser e trovi #open il div devi lasciarlo aperto".
Perchè come detto prima la pagina non viene elaborata nuovamente.

ho letto la documentazione ma non mi ha chiarito le idee.

Potresti essere più chiaro SimoX90, perpiacere? Grzie mille di nuovo

[SimoX90]

volentieri, puoi postarmi il codice con cui chiami showonlyone(thechosenone)?

[SimoX90]

In ogni caso, ti servono un po' di pezzi:

my_control=false;
contatore=0;
function addurl(par){ //funzione per aggiungere (se possibile) un parametro get al tuo url
var url="pagina.php?c="+par;
 if(tipeof history.pushState=="function"){
  if(contatore>1){
  history.pushState(null,'il_tuo_titolo',url);
  my_control=true;
  return false;
  }else{
  history.replaceState(null,'il_tuo_titolo',url);
  my_control=true;
  return false;
  }
 }
};
function showDiv(par){//funzione per animare il div che simula il click dell'utente
    showonlyone(par);
};
$(window).bind("popstate", function(){
 if(my_control){
  my_control=false;
 }else{
   showonlyone(par);
 }
});
$('.tuo_div').click(function(){
 showonlyone(this)//qui non so cosa devi passarle di preciso
 addurl(this);//idem
 ++contatore;
});

La base è questa...
Poi andrebbe fatta la gestione del refresh della pagina in js mettendo al document.ready un parse dell'url, e se impostato il parametro in GET chiamare showonlyone(par);

[rash]

la funzione la richiamo tramite href e cioè <a href="javascript:showonlyone('box');></a> quindi mi sa che l'ultima fase del codice non va bene (quella in cui chiami la funzione click al div .tuo_div o forse dico una cavolata)
a cosa servirebbe poi il refresh della pagina? grazie ancora

[SimoX90]

<a href="javascript

:myclick('box');>
function myclick(box){ showonlyone(box)//qui non so cosa devi passarle di preciso
 addurl(box);//idem
 ++contatore;
});

Per refresh intendevo: tu hai un url del tipo www.miosito.php?c=box dove box è il tuo parametro, se l'utente naviga nella cronoligia funziona tutto ma se refresha quel c=qualcosa perde il suo significato, non so se mi sono spiegato... in pratica devi animare il tuo div in 5 casi:
quando l'utente clicca sul link, //lo fa il tuo codice
quando l'utente naviga nella cronologia, //lo fa il mio codice
quando l'utente digita manualmente un url di quel tipo,
quando lo salva nei preferiti
quando ricarica manualmente la pagina

per gli ultimi tre punti basta un
$(document).ready(function(){
var y= location.href
//devi splittare y in modo da prendere solo il valore del parametro
...
myclick(y)
}

Una cosa interessante può essere l'uso del parametro stateObject delle funzioni pushState e replaceState (quello che è settato null nel mio codice) combinato con l'oggetto history.state, che in pratica permette una sorta di "memoria" nella cronologia (quasi come un cookie-sessione direi, ma in versione js+html5) con cui puoi evitarti tutta la storia del parametro GET (nell'url), però non l'ho mai utilizzato e non ho esempi concreti da passarti

[rash]

ho provato ad inserire il codice che mi hai postato ma non funziona, molto probabilmente sono io che non riesco a farlo funzionare. grazie comunque