jQuery toggle и IF visible

Question

У меня есть div, который содержит параметры и параметры на странице управления учетной записью.

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

Код выше должен изменить текст больше/меньше опций связи в зависимости от того, является ли оно видимым или нет, однако он появляется Jquery не лечит переключаясь как сделать его невидимым/видимым.

Как я могу реализовать это при использовании функции переключения?

Answer 1

Вам необходимо использовать функцию обратного вызова. К моменту выполнения инструкции if слайд-эффект не будет завершен, и вы получите неверные результаты.

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

function callbackFn(){ 

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

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


} 

Answer 2

Я предпочитаю не использовать отдельные функции, потому что, когда одна функция не должна быть использована дважды, это пустая трата кода .. я считаю, что это легче понять, когда кто-то приходит к нему ..

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

Answer 3

Я думаю, что этот код будет работать

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