jQuery alterna e IF visibile

Question

Ho un div che contiene le impostazioni e le opzioni in una pagina di gestione dell'account.

$("#moreOptions").slideToggle('slow'); 
if ($("#moreOptions").is(":visible") == true) { 
    $("#lnkMoreOpt").text("Less Options «") 
} 
else { 
    $("#lnkMoreOpt").text("More Options »") 
} 

Il codice di cui sopra dovrebbe modificare il testo del/meno di collegamento più opzioni a seconda se è visibile o no, comunque sembra jQuery non tratta commutando come è invisibile/visibile.

Come posso implementarlo mentre utilizzo ancora la funzione di commutazione?

Answer 1

È necessario utilizzare la funzione di richiamata. Nel momento in cui viene valutata l'istruzione if, slideToggle non verrà completata e otterrete risultati errati.

$("#moreOptions").slideToggle('slow', callbackFn); 

function callbackFn(){ 

    var $link = $("#lnkMoreOpt"); 

    $(this).is(":visible") ? $link.text("Less Options «") : $link.text("More Options »"); 


} 

Answer 2

preferisco non usare funzioni distinte, perché quando una funzione non ha bisogno di essere usato due volte, è spreco di codice .. Credo che questo sia più facile da capire quando qualcuno viene a esso ..

$("#moreOptions").slideToggle('slow', function(){ 
    var $link = $("#lnkMoreOpt"); 
    $(this).is(":visible") ? $link.text("Less Options «") : $link.text("More Options »"); 
}); 

Answer 3

penso che questo codice funziona

$('#element').toggle('slow', function() { 
    if($(this).is(':hidden')) { 
     $(this).text('This element is hidden.'); 
    } 
    else { 
     $(this).text('This element is visible.'); 
    } 
});