javascript - 预加载图像后触发事件

标签 javascript jquery

这是我用来预加载图像的代码,我不确定它是否是最好的代码。 我的问题是,我怎样才能触发和事件,例如 alert();完成所有图像加载后的对话框?

var preload = ["a.gif", "b.gif", "c.gif"];
    var images = [];
    for (i = 0; i < preload.length; i++) {
        images[i] = new Image();
        images[i].src = preload[i];
    }

最佳答案

如果您愿意,可以使用新的“$.Deferred”:

var preload = ["a.gif", "b.gif", "c.gif"];
var promises = [];
for (var i = 0; i < preload.length; i++) {
    (function(url, promise) {
        var img = new Image();
        img.onload = function() {
          promise.resolve();
        };
        img.src = url;
    })(preload[i], promises[i] = $.Deferred());
}
$.when.apply($, promises).done(function() {
  alert("All images ready sir!");
});

让 Image 对象四处漂浮可能有点冒险,但如果是这样的话,可以通过移动闭包轻松解决。 编辑 事实上,我会自己更改它,因为它困扰着我:-)

关于javascript - 预加载图像后触发事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5623639/

相关文章:

javascript - 两个容器之间的自定义形状线,像进度条一样改变颜色

javascript - 如何使用脚本调用函数

javascript - 如何在每个表行上放置点击事件并将结果作为参数传递以将新数据绑定(bind)到另一个源?

javascript - 用于检查邮政编码文本是否不是来自特定州的正则表达式

javascript - 调整网站的所有文本和背景以实现对比度(对比度交换器)ADA WCAG 合规性

javascript - 默认值更改时向输入添加类

javascript - 仅当尚未设置该字段时,才在 Firestore 文档中设置该字段的值

javascript - AngularJS JSON 对象在 View 中可访问,但在 Controller 中不可访问

javascript - 使用 jQuery 从单独文件中的模板加载 HTML 元素

javascript - 如何在按下tab键后不离开输入字段? (javascript/html)