jquery中的图像原始宽度

使用jQuery，我可以在点击时更改图像的src

$("#thumb li img").click(function() { var newlinkimage = $(this).attr("src"); newlinkimage = newlinkimage.substring(14,17); $("#avant img").attr("src", 'retouche-hr' + newlinkimage + '-a.jpg'); $("#apres img").attr("src", 'retouche-hr' +newlinkimage + '-b.jpg'); 

问题是，新图像宽度与旧图像宽度不同。 我如何获得新图像的NATIVE宽度（就像在Dreamweaver中获得该图像的小箭头一样）

Answer 1

这是一种简单的javascript方式。 将它集成到您​​的代码中应该很容易。

 var newimage = new Image(); newimage.src = 'retouche-hr' + newlinkimage + '-a.jpg'; // path to image var width = newimage.width; var height = newimage.height; 

Answer 2

旧图像的宽度和高度是否设置为它？ 如果你使用$（image）.width（“”）它应该将宽度重置回你应用任何宽度变化之前的宽度（类似于高度）。 我认为这不适用于通过CSS或属性设置宽度的图像。 重置为旧宽度后，可以使用.outerWidth（）来获取图像的宽度。

Answer 3

您希望在更改图像之前获得图像的实际宽度，然后将新图片设置为该宽度。 你可以用$（img）.load来做到这一点：

 var pic_real_width; var pic_real_height; $(img).load(function() { // need to remove these in of case img-element has set width and height $(this).removeAttr("width") .removeAttr("height"); pic_real_width = this.width; pic_real_height = this.height; }); $("#thumb li img").click(function() { var newlinkimage = $(this).attr("src"); newlinkimage = newlinkimage.substring(14,17); $("#avant img").attr("src", 'retouche-hr' + newlinkimage + '-a.jpg').width(pic_real_width); $("#apres img").attr("src", 'retouche-hr' +newlinkimage + '-b.jpg').width(pic_real_width); 

Answer 4

此代码始终返回零’0′

  var newimage = new Image(); newimage.src = 'retouche-hr' + newlinkimage.substring(14,17) + '-a.jpg'; var width = newimage.naturalWidth; var height = newimage.naturalHeight; alert (width); 

为什么???