是否有JavaScript或jQuery API或方法来获取页面上图像的尺寸?
当前回答
Use
function outmeInside() {
var output = document.getElementById('preview_product_image');
if (this.height < 600 || this.width < 600) {
output.src = "http://localhost/danieladenew/uploads/no-photo.jpg";
alert("The image you have selected is low resolution image. Your image width=" + this.width + ", height=" + this.height + ". Please select image greater or equal to 600x600. Thanks!");
}
else {
output.src = URL.createObjectURL(event.target.files[0]);
}
return;
}
img.src = URL.createObjectURL(event.target.files[0]);
}
这适用于多个图像预览和上传。如果你必须为每个图像逐一选择,然后复制粘贴到所有预览图像功能和验证!!
其他回答
clientWidth和clienttheight是DOM属性,显示DOM元素内部维度的当前浏览器大小(不包括边距和边框)。在IMG元素的情况下,这将得到可见图像的实际尺寸。
var img = document.getElementById('imageid');
//or however you get a handle to the IMG
var width = img.clientWidth;
var height = img.clientHeight;
要得到自然的高度和宽度:
.naturalHeight document.querySelector (img); .naturalWidth document.querySelector (img); < img src = " img.png " >
如果你想获取样式的高度和宽度:
document.querySelector(“img”).offsetHeight; document.querySelector(“img”).offsetWidth;
我想我改进了源代码,以便能够在尝试找出其属性之前让图像加载。否则,它将显示'0 * 0',因为下一个语句将在文件加载到浏览器之前被调用。它需要jQuery…
function getImgSize(imgSrc) {
var newImg = new Image();
newImg.src = imgSrc;
var height = newImg.height;
var width = newImg.width;
p = $(newImg).ready(function() {
return {width: newImg.width, height: newImg.height};
});
alert (p[0]['width'] + " " + p[0]['height']);
}
你还可以使用:
var image=document.getElementById("imageID");
var width=image.offsetWidth;
var height=image.offsetHeight;
使用jQuery,你可以这样做:
var imgWidth = $("#imgIDWhatever").width();
推荐文章
- momentJS日期字符串添加5天
- 格式化特定时区的日期
- 如何将此上下文传递给函数?
- 将.NET DateTime转换为JSON
- SameSite警告Chrome 77
- 在ES6 (ECMAScript 6)中是否有一种不带可变变量的循环x次的机制?
- 克隆对象没有引用javascript
- 验证字符串是否为正整数
- 如何获得一个键/值JavaScript对象的键
- 什么时候JavaScript是同步的?
- 在jQuery中取消<select>的最佳方法?
- 如何在Typescript中解析JSON字符串
- jQuery的“输入”事件
- Javascript reduce()在对象
- 在angularJS中& vs @和=的区别是什么