jquery / javascript中的onfinish事件监听器

时间:2011-11-06 23:43:54

标签: jquery event-listener

嘿伙计们这是我当前代码的片段。我想知道如何在此代码中添加“onFinish或Finished”事件监听器。

这是setStage函数

    function setStage($section)
    {

    switch($section)
    {
        case "about":
            if (stageSet == true)
            {
                resetStage();
            }
            $("#one").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#two").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#three").animate({ height: "+=30"}, 1000);
            $("#four").animate({ width: "+=30"}, 1000);
            $("#five").animate({ width: "+=30"}, 1000);
            stageSet = true;
            break;
        case "portfolio":
            if (stageSet == true)
            {
                resetStage();
            }
            $("#one").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#two").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#three").animate({ height: "+=30"}, 1000);
            $("#four").animate({ width: "+=30"}, 1000);
            $("#five").animate({ width: "+=30"}, 1000);
            stageSet = true;
            break;
        case "contact":
            if (stageSet == true)
            {
                resetStage();
            };
            $("#one").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#two").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#three").animate({ height: "+=30"}, 1000);
            $("#four").animate({ width: "+=30"}, 1000);
            $("#five").animate({ width: "+=30"}, 1000);
            stageSet = true;
            break;
        case "resume":
            if (stageSet == true)
            {
                resetStage();
            }
            $("#one").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#two").animate({ width: "+=30", height: "+=30"}, 1000);
            $("#three").animate({ height: "+=30"}, 1000);
            $("#four").animate({ width: "+=30"}, 1000);
            $("#five").animate({ width: "+=30"}, 1000);
            stageSet = true;
            break;
        default:
            alert('not a valid section');
            break;
        }
    }

每个案例中的动画都是独一无二的,但我现在只是让动画完全相同。以下是点击发生的情况。我需要它做的是将一个“off”类应用于每个导航,然后当setStage完成时我需要它来取消该类

$(".nav-btn").click(function()
{
    var section = $(this).attr("title");
    //turn off pointer for obsessive clickers
    $(".nav-btn").addClass("off");

    onComplete: function(setStage(section)
    {
        $(".nav-btn").removeClass("off");
    });
});

这当然不起作用。 setStage函数工作得很好,我想要做的是在函数完成时删除类。我检查了jquery网站上的api事件部分并没有看到任何足够的东西,也许我只是看起来不够努力。 http://api.jquery.com/category/events/或许我在一起看错了部分。有什么想法吗?提前谢谢你帮我解决了我的无知。

1 个答案:

答案 0 :(得分:0)

var removeClass = function() {
    $(this).removeClass("off");
}


    function setStage($section)
{

switch($section)
{
    case "about":
    case "portfolio":
    case "resume":    // and so on

        if (stageSet == true)
        {
            resetStage();
        }
        $("#one").animate({ width: "+=30", height: "+=30"}, 1000, removeClass );
        $("#two").animate({ width: "+=30", height: "+=30"}, 1000, removeClass);
        $("#three").animate({ height: "+=30"}, 1000, removeClass);