jquery - .hide() 之后的 .show() 并不总是显示

Question

我试图显示<div>取决于所选择的操作。我已经在数据库中放置了一个列表，该列表在操作和 <div> 的类之间进行协调。 。测试代码时，它会工作几次，然后随机停止工作。我核实了内容；没关系。在 .hide() 之后使用 .show() 似乎是一个问题或错误。

知道如何修复它吗？

$("#ddlOperation").change(function() {
    var idState = $(this).val();

    // get the name of all classes and hide it
    $.getJSON("/Trademark/hideFirst", function(fiData) {
        $.each(fiData, function (index, itemData) {
            $('.' + itemData.Text).hide("slow");
        });
    });

    // get the class that must be shown
    $.getJSON("/Trademark/LoadFieldByOperation", { id: idState }, 
        function(fData) {   
            $.each(fData, function (index, itemData) {
                $('.' + itemData.Text).show("slow");     
    // doesn't work always even the itemData.Text contains the suitable string!
        });
});

Answer 1

这两个请求是异步的，因此不能保证隐藏项目的第一个回调在第二个回调之前运行。为了确保这一点，您可以执行以下操作:

    // get the name of all classes and hide it
    $.getJSON("/Trademark/hideFirst", function (fiData) {
        $.each(fiData, function (index, itemData) {
            $('.' + itemData.Text).hide("slow");
        });
        // get the class that must be shown
        $.getJSON("/Trademark/LoadFieldByOperation", { id: idState }, function (fData) {   
            $.each(fData, function (index, itemData) {
                $('.' + itemData.Text).show("slow");
            });
        });
    });