在使用Javascript / Asp.net 上传之前获取文件高度宽度
Get file height width before uploading using Javascript / Asp.net
我的网络表单上有Asp:FileUpload控件。
在 FileUpload 控件的 OnChange() 事件上,执行 JavaScript 函数
<asp:FileUpload ID="fUpload" runat="server" Style="visibility: hidden;width:1px" onchange="callme(this)"/>
Javascript功能:
function callme(oFile) {
document.getElementById('<%=txtFilePath.ClientID%>').value = oFile.value;
ReadImage(oFile.value);
}
ReadImage 函数应读取文件并告诉所选文件的高度宽度和大小,如果文件不是图像,则显示错误消息。
function ReadImage(_file)
{
var reader = new FileReader();
var image = new Image();
image.src = 'file://' + _file;
image.onload = function() {
alert('Step 2');
var w = this.width,
h = this.height,
t = file.type,
n = file.name,
s = ~ ~(_file.size / 1024) + 'KB';
alert('<img src="' + this.src + '"> ' + w + 'x' + h + ' ' + s + ' ' + t + ' ' + n + '<br>');
};
image.onerror= function()
{
alert('Invalid file type: '+ _file.type);
};
}
在上传到服务器之前,ReadImage() 函数应该读取所选文件并获取该文件的高度、宽度和大小。
如何做到这一点??我做错了什么。
function callme(oFile)
{
document.getElementById('<%=txtFilePath.ClientID%>').value = oFile.value;
ReadImage(oFile);
}
function ReadImage(_file) {
var fr = new FileReader;
fr.onload = function () { // file is loaded
var img = new Image;
img.onload = function () {
alert('Step 2');
var w = img.width;
var h = img.height;
alert('<img src="' + fr.result + '"> ' + w + 'x' + h + '<br>'); // is the data URL because called with readAsDataURL
};
img.onerror = function () {
alert('Invalid file type');
};
img.src = fr.result; // is the data URL because called with readAsDataURL
};
fr.readAsDataURL(_file.files[0]); // for using a <input type="file">
}
我问题的其余部分 - "上传前获取文件大小"
使用此脚本
function checkFile(fieldObj) {
var FileName = fieldObj.value;
var FileExt = FileName.substr(FileName.lastIndexOf('.') + 1);
var FileSize = fieldObj.files[0].size;
var FileSizeMB = (FileSize / 10485760).toFixed(2);
if ((FileExt != "png" && FileExt != "doc" && FileExt != "bmp" && FileExt != "dib" && FileExt != "JPG" && FileExt != "jpeg" && FileExt != "jpe" && FileExt != "jfif" && FileExt != "gif" && FileExt != "tiff" && FileExt != "tif" && FileExt != "tga") || FileSize > 10485760) {
var error = "File type : " + FileExt + "'n'n";
error += "Size: " + FileSizeMB + " MB 'n'n";
error += "Please make sure your file is in pdf or doc format and less than 10 MB.'n'n";
alert(error);
return false;
}
return true;
}
您是否尝试过没有image.src = 'file://' + _file;
var img = new Image;
img.onload = function() {
alert(img.width);
alert(img.height);
};
img.onerror = function() {
alert("error");
};
img.src = oFile.value;
相关文章:
- Fin上传器直接上传到Azure Blob存储-在Javascript中获取文件uri
- Node js:如何获取文件签名标头而不是 mime 类型
- 如何在没有JQuery的情况下在Javascript中获取文件的内容
- 获取文件并从rest api下载
- 使用javascript获取文件输入
- JS获取文件内容
- 如何在使用javascript上传文件时获取文件源路径
- javascript如何从服务器获取文件夹中文件的url
- 如何使用javascript获取文件夹中的图像列表
- 应用程序脚本-自动从谷歌驱动器删除超过3天的文件-获取文件列表
- 如何在javascript中从ondrop事件中获取文件URL
- 如何使用javascript获取文件夹中的文件列表
- Javascript获取文件内容循环
- 通过Crypto.js获取文件的md5sum
- Cordova应用程序:如何获取文件的实际路径
- 如何使用PHP从我自己的网站上的Google Drive获取文件和文件夹列表
- 如何在所有父节点上获取文件夹图标,在所有子节点上获取文件夹加图标(左侧的图标)
- 我想要获取文件输入并将其保存到本地路径的Javascript
- 从Google Drive获取文件并隐藏到Blob
- drupal7获取文件路径