jQuery/JavaScript执行顺序_Javascript_Jquery_Ruby On Rails

jQuery/JavaScript执行顺序

javascript jquery ruby-on-rails

jQuery/JavaScript执行顺序,javascript,jquery,ruby-on-rails,Javascript,Jquery,Ruby On Rails,我希望用户能够使用jQuery筛选一些项目。用户选择他们的筛选条件并点击submit，然后我调用我的数据库。此调用完成后，我使用此函数淡出现有容器： function clearGrid() { var theseDivs = $('.grid-item'); $('.grid-item').fadeOut('fast', function() { $(theseDivs).remove(); }); } 然后我用以下函数附加新数据： functi

我希望用户能够使用jQuery筛选一些项目。用户选择他们的筛选条件并点击submit，然后我调用我的数据库。此调用完成后，我使用此函数淡出现有容器：

function clearGrid() {
    var theseDivs = $('.grid-item');
    $('.grid-item').fadeOut('fast', function() {
    $(theseDivs).remove();      
    }); 
}

然后我用以下函数附加新数据：

function repopulate() {
    <% @stuff.each do |gb| %>
    $('#grid').append('<%= escape_javascript(render "/stuff", :gb => gb) %>');
    <% end %>
    resizeGrid();
}

函数重新填充（）{
$（“#网格”）。追加（'gb）%>”；
调整网格大小（）；
}

函数的作用是：根据网格中的其他元素进行绝对定位。似乎在使用clearGrid（）删除其他元素之前调用了repopulate（），因此新元素的位置被关闭，它们被渲染为旧元素仍然存在

有没有办法确保我的repopulate（）函数在其他元素完全消失之前不会被调用？

尝试使用

setTimeout( function(){ repopulate(); }, 50 );

请尝试使用减缓重新填充方法的速度

setTimeout( function(){ repopulate(); }, 50 );

您应该允许

clearGrid（）

函数在回调完成后调用回调，然后将其作为回调传递给

repopulate

。将

clearGrid（）

更改为如下所示：

function clearGrid(callback) {
    var theseDivs = $('.grid-item');
    theseDivs.fadeOut('fast', function() {
        theseDivs.remove();
        if(callback) {
            callback();
        }
    }); 
}

clearGrid();
repopulate();

clearGrid( repopulate );

然后，假设您当前调用这两个函数的代码如下所示：

function clearGrid(callback) {
    var theseDivs = $('.grid-item');
    theseDivs.fadeOut('fast', function() {
        theseDivs.remove();
        if(callback) {
            callback();
        }
    }); 
}

clearGrid();
repopulate();

clearGrid( repopulate );

您可以将其更改为如下所示：

function clearGrid(callback) {
    var theseDivs = $('.grid-item');
    theseDivs.fadeOut('fast', function() {
        theseDivs.remove();
        if(callback) {
            callback();
        }
    }); 
}

clearGrid();
repopulate();

clearGrid( repopulate );

注意：

重新填充

后不应有

（）

，因为您希望传递对它的引用，而不是调用它

第二个注意事项：我还将

clearGrid（）

更改为只使用

theseDivs

，而不是再次调用jQuery。这样的速度稍微快一点，尽管你可能不会注意到差异

如果您知道只有

标记可以使用，您可以将选择器更改为

$（'div.grid-item'）

，以获得另一个小的加速。