在 jQuery .load() 内容完全准备就绪后执行 javascript 函数

Question

我有一个模态框，我填充了加载ajax jQuery .load（）函数的内容。主要问题是我只能在 ajax 内容（例如：图像、文本等）完全加载到隐藏模态中后才能执行另一个函数。

例如：我需要根据模态框的宽度和高度将其居中，如下所示：

    var modalbox = $('.modalbox');
        function centermodal(a){                    
            overlayWidth = a.width(),
            overlayHeight = a.height();
            a.css({                     
                'margin-top':'-'+overlayHeight/2+'px',
                'margin-left':'-'+overlayWidth/2+'px'
            }); 
            a.show(); //show the box                    
        }

然后我在加载中执行此函数，但如果它包含图像或任何额外内容，它不会计算模态的正确高度：

modalbox.load('page1.html','',function(){
    centermodal(modalbox);
});

我相信我需要创建某种加载器或在显示之前检查加载的内容。也许有人可以提出解决方案？

谢谢。

Answer 1

jQuery Deferred 对象是此作业的工具。使用 deferred.done（） 函数在 AJAX 调用完成时调用函数。