样式 所有 clas 取图 src 希望 var als eight
在前端中有许多时候希望显示图片的的真实大小的场景 (如果图片预览这样的场景),如果直接用选择器把 html 中的 img 元素选择出来然后输出他的 width() 和 height()的话,如果对 img 元素有做样式限定的则输出的是样式中的高度和宽度, 无法得出图片的真实像素大小。这里可采用新建个图片对象,然后直接载入 (这里可以用 load 载入) 整个图片然后在或者其高宽属性即可。
如以下 demo 代码
jquery 获取图片的真实大小
- $(document).ready(function(){
- $("img").each(function(){ //获取所有img元素,进行遍历
- $("<img />").attr("src",this.src).on("load",function(){ //这里使用的jquery新建一个img对象进行添加attr属性,把src添加上去,然后进行载入事件
- var imgw =this.width; //这里的width和height就是图片实际的宽高了
- var imgh =this.height;
- alert("imgw:"+ imgw +','+"imgh:"+ imgh);
- });
- });
- });
来源: http://www.bubuko.com/infodetail-2451871.html