jQuery 初始化顺序

Question

我正在构建一个页面，我想在其中使用 Galleria 脚本 ( http://devkick.com/lab/galleria/ ) 和 jQuery的 Accordion 小部件可隐藏不同类别的画廊缩略图。在我的初始化中，我按照两个脚本手册的建议编写:

<script type="text/javascript">
        jQuery(function($) { 
        $('ul.gallery').galleria({
         insert: "#image"
        });

         $("#thumbs").accordion();

        });
</script>

galleria() 函数创建缩略图并为其分配适当的大小。然后，accordion() 函数分配其样式并折叠当前不可见的元素。使用上面的代码时，我遇到了一些缩略图由于尺寸为零而变得不可见的问题。

如果我在 galleria() 函数中为缩略图指定大小之前发出警报，我可以看到对于 Accordion 不可见页面内的图像，此时其容器的尺寸为零。这对我来说很奇怪，因为我认为这些函数是连续执行的，并且在 galleria() 完成之前不会调用 accordion() 。

更奇怪的是，如果我在 Accordion 功能之前放置一个警报，那么所有内容都会按正确的顺序处理。

很明显，我在这里面临着竞争条件。为什么会发生这种情况？我应该怎样做才能保证有序的初始化顺序？

Answer 1

这只是一个猜测，但我猜测这与下载图像之前运行的脚本有关。这似乎解释了为什么 Accordion 函数之前的 alert() 使事情正常工作。它使图像有机会加载。

如果这是正确的，您将需要使用 jQuery 的 load() 事件处理程序来确保图像完全加载。

load() 文档:http://api.jquery.com/load-event/