jQuery fadeOut/fadeIn 未按预期工作？

Question

我试图根据用户的选择一次显示一个字段集。理论上，所有字段集应先隐藏，然后显示选定的字段集。我正在使用 jQuery 的 fadeOut 和 'fadeIn` 函数。

你可以看到这个 here 的 fiddle .

但效果并不好。怎么了？当您更改所有权类型时，首先显示两个字段集，然后它们变暗并淡出，然后出现预期的字段集。但是，期望的行为是，在更改所有权类型时，当前可见的字段集会淡出，然后预期的字段集会淡入。

Answer 1

您还可以使用“ promise ”http://api.jquery.com/jQuery.when/确保淡入发生在 fieldset 淡出之后。

$(function() {
    var ownershipType = $('#ownershipType').first();
    var fieldsets = $('fieldset');
    ownershipType.change(function() {
        var promise = fieldsets.fadeOut(2000);
        $.when(promise).then( function () {$('fieldset[data-ownership-type=' + ownershipType.val() + ']').fadeIn('fast');
        });
    });
});

http://jsfiddle.net/DtaHQ/26/