JavaScript中的onload函数不起作用Android

onload function in javascript not working Android

本文关键字：不起作用 Android 函数 onload 中的 JavaScript      更新时间：2023-09-26

我正在尝试将图像读取为文件，然后显示图像名称，大小等。我调试了我的代码，发现我的 onload 函数正在加载但不起作用。谢谢你的帮助。我已经包含了我的整个FileSelection（）方法。

var iBytesUploaded = 0;
var iBytesTotal = 0;
var iPreviousBytesLoaded = 0;
var iMaxFilesize = 1048576; // 1MB
var oTimer = 0;
var sResultFileSize = '';
var oImage = new Image();

function fileSelected() {
alert("hello");
// hide different warnings
document.getElementById('upload_response').style.display = 'none';
document.getElementById('error').style.display = 'none';
document.getElementById('error2').style.display = 'none';
document.getElementById('abort').style.display = 'none';
document.getElementById('warnsize').style.display = 'none';
// get selected file element
var oFile = document.getElementById('image_file').files[0];
// filter for image files
var rFilter = /^(image'/bmp|image'/gif|image'/jpeg|image'/png|image'/tiff)$/i;
if (! rFilter.test(oFile.type)) {
    alert("problem");
    document.getElementById('error').style.display = 'block';
    return;
}
// little test for filesize
if (oFile.size > iMaxFilesize) {
    document.getElementById('warnsize').style.display = 'block';
    return;
}
// get preview element
    oImage = document.getElementById('preview');
    alert("hello2");

// prepare HTML5 FileReader
var oReader = new FileReader();
    alert("hello3")
    oReader.onload = function(e)
    {
       alert("hello4");

    alert("reached");
    oImage.onload = function () { // binding onload event
        alert("hi");
       // oImage.src = e.target.result;
        // we are going to display some custom image information here
        sResultFileSize = bytesToSize(oFile.size);
        document.getElementById('fileinfo').style.display = 'block';
        document.getElementById('filename').innerHTML = 'Name: ' + oFile.name;
        document.getElementById('filesize').innerHTML = 'Size: ' + sResultFileSize;
        document.getElementById('filetype').innerHTML = 'Type: ' + oFile.type;
        document.getElementById('filedim').innerHTML = 'Dimension: ' + oImage.naturalWidth + ' x ' + oImage.naturalHeight;
    };
     // e.target.result contains the DataURL which we will use as a source of the image
    oImage.src = e.target.result;
};
 alert("file found");
// read selected file as DataURL
oReader.readAsDataURL(oFile);

}

给你我在评论中谈论的更改：

//You want this somewhere
var oImage = new Image();
var oReader = new FileReader();
alert("hello3")
oReader.onload = function(e)
{
   alert("hello4");
   oImage.onload = function () { // binding onload event
      alert("hi");
      // we are going to display some custom image information here
      sResultFileSize = bytesToSize(oFile.size);
      document.getElementById('fileinfo').style.display = 'block';
      document.getElementById('filename').innerHTML = 'Name: ' + oFile.name;
      document.getElementById('filesize').innerHTML = 'Size: ' + sResultFileSize;
      document.getElementById('filetype').innerHTML = 'Type: ' + oFile.type;
      document.getElementById('filedim').innerHTML = 'Dimension: ' + oImage.naturalWidth + ' x ' + oImage.naturalHeight;
     };
     // Make sure this comes after
     oImage.src = e.target.result;
};
// read selected file as DataURL
oReader.readAsDataURL(oFile);
相关文章：