![](/img/trans.png)
[英]how to validate the photo upload not greater than 1MB from javascript
[英]HTML5 Image load not working in firefox android for images with size greater than 1MB
我正在創建一個基於此https://demos.phplift.net/javascript-image-compress-using-html5-canvas-file-api/的圖像預覽和上傳頁面。 It is working fine in all web browsers and in android firefox (version 88.1.4) it is not working with images have size greater than 1MB, no issues in android chrome browser. 當我檢查圖像加載時(在代碼中它是i.onload() ) function 沒有觸發 firefox 中的較大圖像
html
<form id="upload_form">
<label for="file">Choose file</label>
<input type="file" id="fileinput" />
</form>
javascript function 是
<script>
var output_format = null;
var file_name = null;
function readFile(evt) {
var file = evt.target.files[0];
var reader = new FileReader();
reader.onload = function(event) {
var i = document.getElementById("source_image");
console.log(i);
i.src = event.target.result;
i.onload = function(){
console.log("Image loaded");
}
};
output_format = file.name.split(".").pop();
file_name = file.name;
console.log("Filename:" + file.name);
console.log("Fileformat:" + output_format);
console.log("Filesize:" + (parseInt(file.size) / 1024) + " Kb");
console.log("Type:" + file.type);
reader.readAsDataURL(file);
return false;
}
document.getElementById("fileinput").addEventListener("change", readFile, false);
</script>
有誰知道為什么大於 1 MB 的圖像不會觸發 firefox 中的圖像加載?
不要使用 FileReader ......認為這可以工作:
i.src = URL.createObjectURL(file)
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.