jQuery ready() 和脚本序列

Question

我是一个 jQuery 菜鸟，我想知道如何解决这个问题：

1. 我有一个外部的.js脚本，我们以reflection.js为例。
2. Reflection.js 为每个 class="reflect" 图像创建画布反射。
3. 我在 ('document').ready 时启动的不同 JS 脚本中附加了一些图像。
4. 当然，reflection.js 不适用于上述脚本创建的图像。

如何避免？

我想我需要回调 (?)。不幸的是，即使在阅读文档之后，我也没有得到回调的想法。

[编辑]

<script src="js/reflection.js" type="text/javascript"></script> 
<script type="text/javascript">

            jQuery().ready(function() {   
            jQuery('#thumbs li').each(function(){
                    jQuery('.'+id+' a').append('<img src="' + imgURL + '" class="reflect" /></a>');
                });
            });
 </script> 

Answer 1

图像加载事件不会冒泡。你不能与那些挂钩。

由于您的图像具有“反射”类，这意味着您可以控制源。所以我建议你的反射代码发布一个API供你调用。

window.Reflect = function(img) {
    ...
};
...
var img = $("<img></img");
img.attr({
   ...
});
Reflect(img);
...

如果您不想这样做，则可以轮询文档以获取新图像。

(function poll() {
    var images = $("img.reflect");
    ...
    images.removeClass("reflect")
    setTimeout(poll, 500);
})();

Answer 2

如果我理解正确，您在“就绪”序列下有 2 个函数，一个脚本依赖于另一个。

我解决这个问题的方式是，我构建了自己的 includeJS 以及在 jQuery 拥有的层​​之上的附加准备检查层。

https://github.com/atk4/atk4/blob/master/templates/js/start-atk4.js

所以我的代码如下所示：

$(function(){
   $.atk4.includeJS('reflection.js');
   $.atk4.includeJS('different.js');
   $.atk4(function(){
       $('.reflect').reflection();
   });
});

发生的事情是，在文档准备好之后，jQuery 会启动上面的代码。它附加 2 个脚本并评估它们（通过添加标签）。评估完成后，函数 atk4.get 将执行与 jQuery 非常相似的准备链。