0

我希望我们都对浏览器的差异感到厌烦，但这似乎有点严重。以下几乎不言自明：

$(function() {
    if (navigator.appName == "Microsoft Internet Explorer") {
        $('#imgdiv').imagefit();
    }

    $('img').bind('load', function() {
        $('#imgdiv').imagefit();
    });
});

在 IE10 中，加载事件处理程序似乎没有触发，但如果我将imagefit()放在ready()函数中，一切都很好。另一方面，如果我在 Chrome 中执行此操作，则图像根本不会显示。有人对此有任何解释吗？我的猜测是这两个浏览器正在以不同的顺序或其他方式做事。只需确认这是一个公认的问题就可以了。

4

1 回答 1

2

来自事件的jQuery API 文档load：

load与图像一起使用时的事件注意事项

开发人员尝试使用 .load() 快捷方式解决的一个常见挑战是在图像（或图像集合）完全加载时执行一个函数。应该注意几个已知的警告。这些是：

  • 它不能始终如一地工作，也不能可靠地跨浏览器
  • 如果图像 src 设置为与以前相同的 src，它不会在 WebKit 中正确触发
  • 它没有正确地冒泡 DOM 树
  • 可以停止对已经存在于浏览器缓存中的图像进行触发

第一个要点解决了我假设的问题。

我可以建议将函数调用 ,$('#imgdiv').imagefit();移到 HTML 页面的底部。对于外部脚本，推迟脚本可能会有所帮助。

于 2013-08-13T13:59:50.893 回答