Question

我已经编写了一个轻量级的jquery插件来管理选项卡切换，它在开发和测试中运行良好。我有一个奇怪的要求，其中一个标签在开口时扩大高度，然后在收盘时收缩高度。这些更改必须是动画，使用在切换切换完成时触发的回调可以轻松完成打开。

然而，我不能让关闭动画工作，这是因为插件继续并在动画完成之前隐藏了标签。

无论如何，我可以强制插件暂停，直到回调函数完成？

我用来触发回调的代码是

if($.isFunction(params.click)){
    params.click.apply(this,[content,tab,set]);
};

我真的不想在插件中管理动画

Answer 1

如果您的插件知道哪个标签当前处于“打开”状态，那么在关闭另一个标签的同时会打开新标签页。

因此，如果您有权调用客户端代码提供的回调函数，打开新选项卡，您肯定需要在之前打开的选项卡上调用“关闭”回调？

Answer 2

为选项卡的打开和关闭创建回调，这样每当用户更改选项卡时，都会为新选项卡触发tabOpening事件，并为旧选项调用tabClosing事件标签

请在您的文档中明确说明首先使用您的插件轻松实现哪些内容！假设首先激活tabClosing，您可以按如下方式编写客户端代码：

var $closingTab = null,
    $openingTab = null;

$('#target').yourPlugin({
    tabClosing: function(tab) {
        $closingTab = $(tab);
    },
    tabOpening: function(tab) {
        $openingTab = $(tab);
        // Animate the 
        $closingTab.animate({}, 1000, function() {
            $openingTab.animate({}, 1000);
        });
    }
});

或者更简单，但不那么原始，你可以有一个tabChange回调，它可以封装整个事件：

$('#target').yourPlugin({
    tabChange: function(oldTab, newTab) {
        $(oldTab).animate({}, 1000, function() {
            $(newTab).animate({}, 1000);
        });
    }
});

如何从回调中延迟插件执行？

2 个答案: