jquery 在每次(）迭代后回调

jquery callback after each() iteration

本文关键字：迭代 回调 jquery      更新时间：2024-02-09
 $.each(mappings, function(key, item) {
        if (match(selected_values, item)) {
          $(key).show("slow");
        } else {
          $(key).hide("slow");
        }
    });
    //At this point, all items are still visible!
    var item_count = $('.item').filter(':visible').length;
    if (item_count < 12) { 
        $('.item').not(':visible').slice(0,12 - item_count).show();
    }

我正在迭代数据结构，根据某些选定的属性，某些项目被隐藏，其他项目被显示。

麻烦的是，客户端要求最少的项目可见。因此，即使过滤工作正常，并且我得到了 3 个可见项目，也应该用另外 9 个元素填充它们，以便至少始终显示 12 个。

现在，在每次迭代之后，.show() 和 .hide() 函数似乎尚未终止。如何以及在何处正确应用填充功能？

我已经检查过了在 .each(( 完成后调用 jQuery 函数，但他在每个.show()或.hide()后应用该函数，这不是我想要的(在迭代过程中填充是不行的，我们首先需要隐藏所有不适用的(。

这个：在jQuery每次迭代后执行回调不起作用，当调用函数时，我遇到了同样的问题(show(( 和 hide(( 尚未完成(。

编辑：我刚刚发现删除.show()和.hide()方法中的"slow"属性可以解决问题。现在，如果我想保留动画怎么办？

它是同步的，所以你不需要回调，但你有异步动画，这才是真正的问题。只需在循环中使用计数器而不是检查元素长度，或添加一个类：

$.each(mappings, function(key, item) {
    if (match(selected_values, item)) {
      $(key).addClass('selected').show("slow");
    } else {
      $(key).hide("slow");
    }
});
if ($('.item.selected').length < 12) { 
    $('.item').not('.selected').slice(0,12 - item_count).show();
}

只需将.stop()添加到链中即可获得良好的结果：

$('.item').not(':visible').slice(0,12 - item_count).stop().show();

任何先前启动的动画(显示/隐藏(都将停止，并且仅显示该项目。

相关文章：