Javascript 与'；一起使用切换时功能中断；慢'；选项

问题是，当我在没有任何选项（即默认选项）的情况下使用toggle函数时，项上的“is（'：visible'）会返回正确的状态

但是，当我使用toggle（“slow”）时，它会显示不正确的状态，并且总是将toggle操作的项目显示为visible false。当然，我会在回调函数中检查，以确保动画完成

请看下面的代码

jQuery(document).ready(function () {
    var h3 = jQuery("#myAccordion").find('h3');
    jQuery("#myAccordion").find('h3').find('span').addClass("ui-state-active ui-icon");
    jQuery.each(h3, function () {
        jQuery(this).bind('click', function () {
            jQuery(this).next('div').toggle("slow", "swing", callback);
        });
    });
});

function callback () {
    if (jQuery(this).next('div').is(':visible')) {
        alert('visible--' + jQuery(this).next('div').is(':visible'));
        jQuery(this).find('span').removeClass("ui-state-default ui-icon").addClass("ui-state-active ui-icon");
    }
    else {
        alert('visible--' + jQuery(this).next('div').is(':visible')); // always goes into this 'else' even though the item is visible.
        jQuery(this).find('span').removeClass("ui-state-active ui-icon").addClass("ui-state-default ui-icon");
    }
}

但是，如果不使用带有切换的“慢速”选项，同样的方法也可以很好地工作

更新2： 看看这里

任何指示

---

更新1：这是小提琴

上下文

这

也没有扩展到

回调

函数。你可以试试这样做。我已经更新了。我在这里贴同样的

jQuery(document).ready(function () {
    var h3 = jQuery("#myAccordion").find('h3');
    jQuery("#myAccordion").find('h3').find('span').addClass("ui-state-active ui-icon"); // first the item is visible
    jQuery.each(h3, function () {
        jQuery(this).bind('click', function () {
console.log(this);
            jQuery(this).next('div').toggle("slow","swing",callback(this));
        });
    });
});

function callback (that) {
    setTimeout( function () {
        console.log(jQuery(that).next('div').is(':visible'));
    if (jQuery(that).next('div').is(':visible')) {
        alert('visible--' + jQuery(that).next('div').is(':visible'));
        jQuery(that).find('span').removeClass("ui-state-default ui-icon").addClass("ui-state-active ui-icon");
    }
    else {
        alert('visible--' + jQuery(that).next('div').is(':visible'));
        jQuery(that).find('span').removeClass("ui-state-active ui-icon").addClass("ui-state-default ui-icon");
    }
    }, 1000);
}

我添加了一个

SetTimeout

，以获得您想要的结果。在动画完成后调用回调函数。对但在CSS更改为

显示：none

后，则不会。CSS更改在几毫秒后发生

但是，如果不使用带有切换的“慢速”选项，同样的方法也可以很好地工作

---

我不确定您是如何使用除slow

之外的其他选项的。上下文

此

也没有扩展到

回调

函数。你可以试试这样做。我已经更新了。我在这里贴同样的

jQuery(document).ready(function () {
    var h3 = jQuery("#myAccordion").find('h3');
    jQuery("#myAccordion").find('h3').find('span').addClass("ui-state-active ui-icon"); // first the item is visible
    jQuery.each(h3, function () {
        jQuery(this).bind('click', function () {
console.log(this);
            jQuery(this).next('div').toggle("slow","swing",callback(this));
        });
    });
});

function callback (that) {
    setTimeout( function () {
        console.log(jQuery(that).next('div').is(':visible'));
    if (jQuery(that).next('div').is(':visible')) {
        alert('visible--' + jQuery(that).next('div').is(':visible'));
        jQuery(that).find('span').removeClass("ui-state-default ui-icon").addClass("ui-state-active ui-icon");
    }
    else {
        alert('visible--' + jQuery(that).next('div').is(':visible'));
        jQuery(that).find('span').removeClass("ui-state-active ui-icon").addClass("ui-state-default ui-icon");
    }
    }, 1000);
}

我添加了一个

SetTimeout

，以获得您想要的结果。在动画完成后调用回调函数。对但在CSS更改为

显示：none

后，则不会。CSS更改在几毫秒后发生

但是，如果不使用带有切换的“慢速”选项，同样的方法也可以很好地工作

---

我真的不确定您是如何使用除slow

之外的其他选项的，请在执行回调之前尝试添加

setTimeOut

500毫秒。请将您的代码放在JSFIDLE中。@T0X1C，这是FIDLE@devnull69，这里是@T0X1C，setTimeOut无效请在执行回调之前尝试添加

setTimeOut

500毫秒。请把代码放在JSFIDLE中。@T0X1C，这是fiddle@devnull69，这是@T0X1C，setTimeOut没有work@tariq：如果它对您的情况有帮助并且可以帮助他人，请将其标记为已接受的答案。感谢专业人士的努力。这确实有效，我接受了，但实际上我需要做的工作，现在有点滞后。。我指的是我所做的类更改，虽然现在成功了，但有一个时间延迟，而且不是即时的。关于“我不确定你是如何让它使用慢以外的选项工作的”，请检查我的更新。@tariq:你可以相应地调整

setTimeout

。我只给出了1秒的粗略值。但我怀疑它会加速很多，可能还要500毫秒。如果你不想有任何延迟，你可以去掉动画。或者最好将CSS3转换设置转换为easeinout，而不是使用jquery。这样您就不需要超时。性能也更好。是的，我做了，但它只有在大约610微秒的时候才起作用。这种滞后是很明显的，你有没有检查过另一把小提琴，它只需拨动一下就可以正常工作。问题仍然是，为什么它会这样？？它是如何能够得到正确的可见性状态只是切换，而不是切换慢@塔里克：如果这个答案对你的处境有帮助并且可以帮助其他人，请将其标记为已接受的答案。感谢专业人士的努力。这确实有效，我接受了，但实际上我需要做的工作，现在有点滞后。。我指的是我所做的类更改，虽然现在成功了，但有一个时间延迟，而且不是即时的。关于“我不确定你是如何让它使用慢以外的选项工作的”，请检查我的更新。@tariq:你可以相应地调整

setTimeout

。我只给出了1秒的粗略值。但我怀疑它会加速很多，可能还要500毫秒。如果你不想有任何延迟，你可以去掉动画。或者最好将CSS3转换设置转换为easeinout，而不是使用jquery。这样您就不需要超时。性能也更好。是的，我做了，但它只有在大约610微秒的时候才起作用。这种滞后是很明显的，你有没有检查过另一把小提琴，它只需拨动一下就可以正常工作。问题仍然是，为什么它会这样？？它是如何能够得到正确的可见性状态只是切换，而不是切换慢！