Question

我正在尝试编写一些代码来打印div中包含的所有图像的尺寸，这很简单，因为它似乎无法让它工作。有人能指出这里的错误吗？谢谢！

$(document).ready(function() {

  var width = 0;
  var height = 0;
  var hello = "hello";

  $('#imagebox img').each(function(){

    width = $(this).width;
    height = $(this).height;
    $('#main').append(hello);
    $('#main').append(width);
    $('#main').append(height);    
  });

});

JSBin Example Here

Answer 1

宽度和高度是功能。尝试：

width = $(this).width();
height = $(this).height();

Answer 2

没有属性widht和height。你能做的是

width = $(this).css('width');

或

width = $(this).width();

和高度类似。

Answer 3

您应该在图像完全加载后执行此操作。

为此，可以将代码放在.load()处理程序中。

var main = $('#main');

$('#imagebox img').load(function(){
  var $th = $(this);
  width = $th.width();
  height = $th.height();
  main.append((hello + width) + height);   
});

或者如果您想确保以正确的顺序添加图片尺寸，请在window加载时进行。

$(window).load(function() {
    var main = $('#main');

    var vals = $('#imagebox img').map(function(){
      var $th = $(this);
      width = $th.width();
      height = $th.height();
      return (hello + width) + height;   
    }).get();

    main.append( vals.join('') );
});

Answer 4

我已将您的版本修改为

使用适当的高度和方法宽度
停止重新查询DOM 元素一遍又一遍
停止重复追加

请参阅http://jsbin.com/ikoge5/15/edit

Jquery-在.each循环中获取图像尺寸？

4 个答案: