jquery - 简单的 jQuery 变量事件

Question

我知道这是一个基本问题，但这些问题让我很困惑。

我定义一个变量:

var img_w = $('#image').width();

然后我这样做:

$(document).ready(function() {
    if (img_w > 100) {
        //do stuff
    }
});

我的图像是从单独的 html 加载的，使用 jQuery 进行样式设置，然后符合 >100 个标准，但为时已晚。所以我尝试:

$(window).load(function()
$(window).on('load' function()
$(window).onload(function()
$(window).ready(function()

依此类推...但由于事件的顺序而无济于事。

所以简单的解决方案是当 img_w 大于 100 时创建一个事件。但由于某种原因，我无法找出执行此操作的最佳方法。我确信我缺少一个简单的解决方案。任何帮助都感激不尽。 :)

编辑:扩展您对正在发生的事情的疑问； div 的宽度设置为 img_w。 img_w 获取其值的图像是从外部 html 文件加载的。设置 div 宽度的 jQuery 以及创建变量的位置位于外部 html 文件中。

Answer 1

您可以利用 DOMSubtreeModified 事件，该事件会在元素属性发生更改时执行。

$('#image').bind("DOMSubtreeModified", CheckHeight);

这是一个示例:https://jsfiddle.net/DinoMyte/6d5ry9br/

更新:由于 DOMSubtreeModified 已被弃用并且可能不再与所有浏览器兼容，因此另一个可能的选择是将事件处理程序委托(delegate)给元素并在外部事件调用期间手动调用更改事件:

$('#image').bind("DOMModified", CheckHeight);
$("#image").triggerHandler('DOMModified');

这是一个示例:https://jsfiddle.net/DinoMyte/6d5ry9br/1/