jQuery .when().done()不工作

我想开始说我是jQuery的新手,我怀疑我只是做一些愚蠢的事情,所以希望这对一个人来说很简单.

我正在为我的网站添加一个滑动的移动子菜单.我想要一个协调效应,如果我单击一个父链接,它的子子菜单打开,所有其他子菜单关闭.问题是时间 – 子子菜单打开,然后通过重置所有子菜单再次关闭.我假设答案是使用延期,但我尝试的一切都失败了.这是(目前不工作)代码：

function ResetMenu(){
    jQuery(".mobile-menu").find(".sub-menu").slideUp(100);
    jQuery(".mobile-menu").find(".menu-item-has-child").removeClass("open");
};

function OpenSubmenu(){
    jQuery(this).next("ul").slideDown(100);
    jQuery(this).parent().addClass("open");
};

jQuery("li.menu-item-has-children > a").click(function(){

    if(jQuery(this).parent().hasClass("open")){
        jQuery(".mobile-menu").find(".sub-menu").slideUp(100);
        jQuery(this).parent().removeClass("open");
    } else {
        jQuery.when(ResetMenu()).done(OpenSubmenu());
    }
    return false;
});

任何帮助将不胜感激.谢谢！

Ronel

解决方法

这是一个常见的错误,如何使用jQuery.when().

jQuery.when()需要承诺作为参数.知道你通过的功能在某种程度上是完全没有神奇的力量.那些函数必须返回在底层代码完成时解决或拒绝的承诺,然后可以将这些承诺传递给jQuery.when().

你的ResetMenu()函数不返回任何东西,所以你的jQuery.when()不等待任何东西.它立即执行.then()处理程序(看起来不是你想要的).

所以,在这一行：

jQuery.when(ResetMenu()).done(OpenSubmenu());

ResetMenu()必须返回一个jQuery.when()的承诺,以便知道它什么时候完成.

您可以通过这样做来修复ResetMenu()：

function ResetMenu(){
    return jQuery(".mobile-menu").find(".sub-menu").slideUp(100).promise().then(function() {
        // remove this class when the animation has completed
        jQuery(".mobile-menu").find(".menu-item-has-child").removeClass("open");
    });
};

然后,进一步,你需要改变你如何将函数传递给.done()到这一点,这两者都使它只是一个函数引用,可以执行LATER并将适当的值绑定到它：

jQuery.when(ResetMenu()).done(OpenSubmenu.bind(this));

注意,.bind(this)假设这是适当的值.您可以传递任何值是正确的值,并在OpenSubmenu()执行时成为此值.

jQuery .when().done()不工作

解决方法

猜你在找的jQuery相关文章