我有以下代码
if(MyObject.Properties.Age==null)
{
MyObject.Properties.Age = new Age();
}
我可以通过此代码获取标题的图像名称
var inputLocalFont = document.getElementById("image-input");
inputLocalFont.addEventListener("change",previewImages,false);
function previewImages(){
var fileList = this.files;
var anyWindow = window.URL || window.webkitURL;
for(var i = 0; i < fileList.length; i++){
var objectUrl = anyWindow.createObjectURL(fileList[i]);
$('.preview-area').append('<img class="resizeme" id="myImage" height="150" src="' + objectUrl + '" + title="' + fileList[i].name + ' ( ' + fileList[i] + ' "/>');
window.URL.revokeObjectURL(fileList[i]);
}
}
但是当我尝试通过添加此代码来添加标题图片中的宽度和高度时
fileList[i].name
它给予&#34; undefined &#34;导致
我已经尝试使用fileList[i].width
fileList[i].height
了
并且它给出了相同的结果
FLOW
我尝试在用户按下提交并将图像上传到服务器之前创建多个图像预览...我希望每个预览图像都包含工具提示标题,其中包含(名称,宽度,高度)
我已经成功通过
fileList[i].naturalWidth
是否可以在工具提示标题中获得图像的宽度和高度?
在圈内添加事件听众
fileList[i].name
我已经尝试在中添加事件监听器 objectUrl / filename [i]
有财产
。宽
.naturalWidth
.clientWidth
我失踪了什么?
HTML
var inputLocalImage = document.getElementById("image-input");
inputLocalImage.addEventListener("change",previewImages,false);
function previewImages(){
var fileList = this.files;
var anyWindow = window.URL || window.webkitURL;
for(var i = 0; i < fileList.length; i++){
var objectUrl = anyWindow.createObjectURL(fileList[i]);
objectUrl.addEventListener("load", function() {
alert('objectUrl.width');
})
$('.preview-area').append('<img class="resizeme" id="myImage" height="150" src="' + objectUrl + '" + title="' + fileList[i].name + ' (s ' + fileList[i].clientWidth + ' "/>');
window.URL.revokeObjectURL(fileList[i]);
}
}
预览区域类是我的多个图像预览容器...我通过此代码附加它
<div class="row">
<label for="image" class="control-label col-lg-3">Image<span class="required">*</span></label>
<div class="col-lg-8">
<input type="file" class="dimmy" id="image-input" multiple />
<div class="preview-area"></div>
</div>
</div>
答案 0 :(得分:1)
请参阅此示例:http://jsfiddle.net/kevalbhatt18/pjf3uffs/3/
注意:在此示例中,我没有多个图像,所以我得到宽度和 点击图像时的高度
要更改宽度,请使用 inputLocalFont.style.width ='500px';
获取图片名称:
的
的myGame-app://
的
Object moved to here
的
答案 1 :(得分:0)
您需要将eventListener用于图像对象的“load”事件,然后才能获得图像的宽度。
img.createEventListener("load", function() {
alert(img.width);
})