javascript - 在 jQuery 中，当图像加载到 "Each & Load"循环中时如何调用函数

Question

我正在写一个像这样的小插件:

(function($){
  $.fn.extend({
    myplugin: function (callback) {
      return this.each(function(){
        $(this).one('load',function(){
          // Manipulate Images
        }) ;
      }) ;
    }
  }) ;
})(jQuery);

我想在插件完成其工作后触发回调:

jQuery('img').myplugin({function(){
  // Do something
}) ;

我该怎么做？

编辑:它仍然没有解决，即使我因为我的问题没有明确指定而得到了减分。但这显然是一个有点棘手的解决方案。有没有 js ninja 可以解决这个问题？

谢谢!

Answer 1

我会使用延迟对象:

(function($) {

    $.fn.extend({
        myplugin: function (callback) {

            // create array of deferred objects to track loading
            var dfds = this.map(function(ix, el) {
                return $.Deferred(function(def) {
                    $(el).one('load', def.resolve)
                         .one('error', def.resolve);
                }).promise();
            }).get();

            // register the final callback
            $.when.apply($, dfds).done(callback);

            // and chain
            return this;
        }
    }) ;
})(jQuery) ;

参见http://jsfiddle.net/Yq4Mf/1/ (感谢@salexch 最初的 fiddle ，然后我用我的答案 fork 了)