JQuery为图像创建弹出窗口，通过URL获取图像的大小

Question

我想使用JQuery创建一个包含图像的弹出窗口。单击链接时，将显示该窗口。窗口的大小取决于图像大小。

有一些链接。链接目标是“_new”，因此当单击链接时，jquery为：

jQuery('a[target^="_new"]').click(function () {

        return openWindow(this.href);
    });

然后弹出功能将是：

function openWindow(url) {
      width = $("img[src$='" + url + "']").width;
      height= $("img[src$='" + url + "']").height;
     window.open(url , 'newwindow', 'width=' + width + ', height=' + height);
}

当我调试时，我发现URL是正确的。但我无法通过其URL获取图像元素（然后我无法获得其宽度和高度来设置弹出窗口大小的样式）。任何人都可以帮我解决这个问题？谢谢！

Answer 1

问题是您只能在将图像加载到浏览器内存后计算宽度和高度

为了使其工作，您必须在加载事件处理程序中执行计算。

var img = $('<img src="'+ url +'"/>').load(function(){ 
  var width = this.width;
  var height = this.height;
});