2009-08-28 16 views
14

Quando si utilizza il metodo sliderToggle, l'espressione :visible non sembra mai restituire altro che true.slideToggle e: visible

Se utilizzo manualmente show/hide in combinazione con l'espressione :visible funzionerà correttamente.

Esempio di fallimento:

jQuery(".fileNode .nodeExpander").click(function() { 
    var notes = jQuery(this).parent().siblings(".fileNotes"); 
    notes.slideToggle ("fast"); 

    var isVisible = notes.is(":visible"); // Always returns true... 

    // Do stuff based on visibility... 
}); 

Esempio di di lavoro:

jQuery(".fileNode .nodeExpander").click(function() { 
    var notes = jQuery(this).parent().siblings(".fileNotes"); 
    var isVisible = notes.is(":visible"); 

    if (isVisible) 
     notes.hide("fast"); 
    else 
     notes.show("fast"); 

    // Do stuff based on visibility... 
}); 

Alcuni html:

<ul> 
    <li class="fileNode"> 
     <img src="<%= Url.Content ("~/Images/Collapse.png") %>" alt="<%= UIResources.CollpaseAltText %>" class="nodeExpander" /> 
    </li> 
    <li class="fileLink"> 
     <%= Html.ActionLink (file.Name, "Details", new { id = file.FileId }) %> 
    </li> 
    <li class="fileNotes"> 
     <%= file.Description %> 
    </li> 
</ul> 

Sto assumendo che il slideToggle non lo fa fare a show/hide - c'è qualcos'altro che posso controllare?

Ho provato in Firefox 3.5, IE 7, 8 e Chrome 4 ... tutti con gli stessi risultati.

Grazie, K

risposta

27

Il tuo primo (non funzionante) frammento di codice sarà testare :visible mentre slideToggle è a metà di transizione (più precisamente, mette alla prova solo dopo la transizione inizia.) Indipendentemente dal fatto che' in caso di apertura o chiusura, lo stato di transizione intermedia sarà :visible, quindi ottieni sempre true.

Prova a controllare .is(":visible") prima di chiamare slideToggle

+3

Naturalmente! Grazie, sentiti come un muppet ora - chiamando var isVisible =! Notes.is (": visible"); prima della slideToggle ottengo la risposta richiesta. Grazie! – Kieron

+0

È un po 'contro-intuitivo, ma ha perfettamente senso. Se solo abbiamo uno stato slide-up interno per l'oggetto jQuery ... –

2

provare ad aggiungere un gestore.

notes.slideToggle ("fast", function() { 
    var isVisible = notes.is(":visible"); 
}); 
Problemi correlati