jQuery Toggle State

Ecco il veloce e magro del mio problema:

  $ ("a"). toggle (function () {/ * function A * /}, function () {/ * function B * /}); 

All’interno della function A viene visualizzato un modulo. Se l’utente completa correttamente il modulo, il modulo viene nuovamente nascosto (ritornando allo stato originale).

All’interno della function B è nascosta la stessa forma.

La teoria alla base di questo è che l’utente può scegliere di visualizzare il modulo e compilarlo, oppure è ansible fare nuovamente clic e mantenere il modulo nascosto.

Ora la mia domanda è questa: al momento, se l’utente compila il modulo con successo – e va in clandestinità – l’utente dovrebbe cliccare due volte sul link prima di tornare allo stato di commutazione che visualizza il modulo.

Esiste comunque la possibilità di reimpostare a livello di programmazione il commutatore sul suo stato iniziale?

jQuery ha due metodi .toggle() :

.toggle()

Attiva / distriggers ciascun set di elementi corrispondenti. Se vengono mostrati, triggersrli fa nasconderli. Se sono nascosti, triggersre e distriggersre.

.toggle(even, odd)

Passa tra due chiamate di funzione ogni altro clic.

In questo caso vuoi il primo. Qualcosa di simile dovrebbe fare il trucco:

 $("a").click(function() { $("#theForm").toggle(); }); 

Puoi controllare lo stato del commutatore in jQuery usando .is(":hidden") . Quindi nel codice base cosa ho usato:

 $("#div_clicked").click(function() { if ($("#toggle_div").is(":hidden")) { // do this } else { // do that } }); # add missing closing 

Ecco cosa ho usato:

 $(document).ready(function() { $('#listing_position').click(function() { var div_form = $('#listing_position_input'); if (div_form.hasClass('hide')) { div_form.removeClass('hide'); } else { div_form.addClass('hide'); } }); }); 

Ah, sono le cose semplici della vita …

Stavo usando l’ultima definizione di toggle(even,odd); , ma avevo dimenticato di includere nella mia descrizione originale del problema che la mia seconda funzione di commutazione non nascondeva solo il modulo, ma lo distruggeva.

function A : Ajax carica il modulo in un div aggiunto. Nascondere e distruggere il div su un post di successo.

function B : distruggi il div.

Entrambi mi hai ricordato che toggle(); si occupa solo della proprietà CSS e in quanto tale non è adatto a questo compito. Ma poi mi sono reso conto che stavo caricando inutilmente il modulo su ogni “strano” stato distruggendolo quando avevo finito, quindi alla fine sono tornato a questo:

  $ ("link"). click (function () {
     if ($ (this) .siblings (". form-div"). length == 0) {
         // form non è caricato;  caricare e mostrare il modulo;  nascondi quando hai finito
     }
     altro {
         . $ (this) .siblings ( "forma-div") alternare ();
     }
 }); 

… che fa quello che voglio che faccia. Grazie per avermi impostato su toggle(); !

Sono andato con questo per evitare la class add hide / show. Penso che questo sia più flessibile della soluzione di Foxy in quanto è ansible aggiungere più funzioni all’interno, ma non citare me che sono un noob

 $("#clickie").click(function(){ if ( $("#mydiv").css("display") == "none" ){ $("#mydiv").show(); } else { $("#mydiv").hide(); } 
 $("#div_clicked").click(function() { if ($("#toggle_div").is(":visible")) { // do this } else { // do that } 

Sostituisci nascosto con visibile