Jquery: выполнить функцию, когда другая закончена - PullRequest
Новая
       9

Jquery: выполнить функцию, когда другая закончена

0 голосов
/ 18 сентября 2011

Мне нужна твоя помощь. Я хочу анимировать с помощью jquery панели. Он должен открываться при нажатии на кнопки (функция OPEN_PANEL) и загружать на него различные php-страницы, а затем закрываться при нажатии на div с классом «close» (функция CLOSE_PANEL). Это работает нормально, проблема в том, что я хочу открыть другую панель, когда она уже открыта. Он должен закрыть открытый и после этого открыть последний, который я выбрал, но похоже, что он выполняет обе функции одновременно. Как я могу решить проблему?

Это код JavaScript: 

var panel_is_open=0;
var last_open_panel="";

function animation_open_panel(id){
    window_height=$(window).height()*0.85;
    $("#"+id+"_button").css({'background-color':'rgba(255,255,255,0.8)', 'box-shadow':'0px 5px 10px #39C', '-webkit-box-shadow':'0px 5px 10px #39C'});
    $("#main_panel").show().animate({ height: window_height+"px" }, 1500)
    .animate({ width: "90%" },1000);
    $("#main_panel").queue(function(){
        $(".close").show();
        $("#page_container").hide().load(id+"/"+id+".php",function(){
            $("#page_container").fadeIn(1000);
        });
        $(this).dequeue();
    });
}

function animation_close_panel(){
    $("#page_container").fadeOut(1000, function(){
        $("#main_panel").animate({ width: "637px" }, 1000)
        .animate({ height:"0px" }, 1500, function(){
            $(".close").hide();
            $("#"+last_open_panel+"_button").css({'background-color':'', 'box-shadow':'', '-webkit-box-shadow':''});
        });
    });
}

function close_panel(){
    if(panel_is_open==1){
        animation_close_panel();
        panel_is_open=0;
    }
}

function open_panel(id){
    if(panel_is_open==0){
        animation_open_panel(id);
        last_open_panel=id;
    }

    else if(panel_is_open==1){
        if(id!=last_open_panel){
            close_panel();
            open_panel(id);
        }
    }

    panel_is_open=1;
}

Заранее большое спасибо за помощь.

Большое спасибо за ваши предложения, но я не смог решить проблему с обоими решениями. Я что-то ошибаюсь, но не могу понять, что.

Это мой код: 

function close_panel(){
    if(panel_is_open==1){
        // animations here
        panel_is_open=0;
    }
}

function close_open_panel(next){
    close_panel();
    next();
}

function open_panel(id){
    if(panel_is_open==0){
        // animations here
        last_open_panel=id;
        panel_is_open=1;
    }

    else if(panel_is_open==1){
        if(id!=last_open_panel){
            close_open_panel(function(){
                open_pannel(id);
            });
        }
    }
}

Есть идеи, где я ошибаюсь? Спасибо.

Ответы [ 2 ]

1 голос
/ 18 сентября 2011

Если вы ищете конкретное решение jQuery, найдите Отложенный объект :

jQuery.Deferred (), представленный в версии 1.5, представляет собой объект с возможностью цепочки, который может регистрировать множественные обратные вызовы в очереди обратного вызова, вызывать очереди обратного вызова и передавать состояние успеха или сбоя любой синхронной или асинхронной функции.

0 голосов
/ 18 сентября 2011

Вы можете использовать обратные вызовы в функциях, например, 

function open(callback)
{
   // do stuff
   callback(some_value);
}

Тогда вы можете использовать его, выполнив следующее: 

open(function(value)
{
    // anything here will be executed
    // after the function has finished
});

Значение в callback() и function(value) является необязательным, вы можете вернуть простую функцию вместо передачи значения, которое необходимо вызвать обратно, однако это полезно для некоторых определенных функций, которые требуют асинхронных обратных вызовов.

Дополнительная информация о функциях обратного вызова:

...