Jquery:在一个函数完成时执行另一个函数

Jquery: execute a function when another is finished

本文关键字：函数 一个 完成时 执行 另一个 Jquery      更新时间：2023-09-26

我需要你的帮助。我想用jquery动画面板。它必须打开点击按钮(函数OPEN_PANEL)，并加载不同的php页面上，然后关闭时，点击一个div类"关闭"(函数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);
            });
        }
    }
}

你知道我错在哪里吗?谢谢。

如果你在jQuery特定的解决方案，然后查找延迟对象:

jQuery.Deferred()，在1.5版中引入，是一个可链的实用对象，它可以将多个回调注册到回调队列中，调用回调队列，并中继任何同步或异步函数的成功或失败状态。

你可以在函数中使用回调，例如

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

那么你可以这样使用它:

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

callback()和function(value)中的值是可选的，您可以返回一个直接的函数，而不是传递一个要回调的值，但是，对于某些需要异步回调的函数来说，它是有用的。

关于回调函数的更多信息:

  • 了解JavaScript中的回调函数
相关文章：