.width()为图像宽度返回0

Question

我正在尝试记录图像的宽度,我尝试的每件事都返回0.任何想法为什么？这就是我到目前为止所拥有的.

jQuery的

var imgWidth = $('#imageMap').width();
console.log(imgWidth);

生成图像的ERB

 <% @image.each do |image| %>
      <% image.contacts.each do |conn| %>
        <span class="connection" data-pos-x="<%= conn.pos_x %>" data-pos-y="<%= conn.pos_y %>"  data-pos-width="<%= conn.pos_width %>" data-pos-height="<%= conn.pos_height %>"> </span>
      <% end %>
      <%= f.hidden_field :image_id, value: image.id %>  
      <%= image_tag(image.image.url(:large), id: 'imageMap')  %>
  <% end %>

Answer 1

如果img标记本身在其style属性中没有宽度或者设置了width属性,则只要图像未完全加载,返回的宽度就为0.使用"load"事件来检测此项或在图像上手动设置宽度(如果您知道):

$('#imageMap').attr('src', 'your_image.jpg').load(function() {  
    console.log($(this).width());
});