每个（）完成后的防火function

这与这个问题有点关系。 在.each（）完成后调用jQuery函数

但解决方案似乎并不适合我。

基本上我有一些JavaScript来计算一些元素的宽度：

var totalWidth = 0; $element.find('li').each(function () { totalWidth += $(this).width(); }); 

在此之后，我想使用宽度来设置另一个元素：

 $element.width(totalWidth); 

如果我附加调试器它可以工作，但如果我只是运行它不会。 这让我觉得宽度是在.each()完成之前设置的。

我尝试使用.promise()来解决这个问题，但似乎没有什么区别。

 var totalWidth = 0; $element.find('li').each(function () { totalWidth += $(this).width(); }); $element.promise().done(function () { $element.width(totalWidth); }); 

这是我的HTML

有任何想法吗？

Answer 1

由于您的宽度计算应该等到图形加载，然后您可以尝试以下方法：

 $(window).load(function () { var totalWidth = 0; $element.find('li').each(function () { totalWidth += $(this).width(); }); $element.width(totalWidth); }); 

从load()事件示例描述我们可以看到：

页面完全加载包括图形时运行一个函数。

 $(window).load(function () { // run code }); 

请注意，目前似乎不推荐使用 load()事件，因此您应该考虑使用的jQuery版本。

Answer 2

这是.each的已知问题

你可以这样做

  var totalWidth = 0; var $elems = $element.find('li'); (function fetch(i) { if(i >= $elems.length) return; // no elems left var $elem = $elems.eq(i); totalWidth += $($elem).width(); if(i+1==$elems.length) { $element.width(totalWidth); } else { fetch(i + 1); // next one } })(0); // start with first elem