FileReader在沒有選擇文件的情況下無法工作

我已經使用FileReader使用javascript讀取選定的文件。下面是代碼FileReader在沒有選擇文件的情況下無法工作

HTML：

<img id="preview" ng-src="{{user_picture}}" ng-click="triggerUpload()" alt="" width="160" height="160" class="img-thumbnail" /> 
<input type="file" onchange="angular.element(this).scope().viewImage(this.files)" accept="image/jpg,image/jpeg,image/png" id="fileInput" name="filedata" />

SCRIPT：

$scope.triggerUpload = function() { 
    show_image(); 
} 

$scope.list = []; 
$scope.viewImage = function (file) { 
    show_image(file);   
} 



    function show_image(image) { 
     var fileuploader = angular.element("#fileInput"); 
     fileuploader.on('click', function() {   
      if (image && image[0]) { 
       var reader = new FileReader();    
       reader.onload = function (e) { 
        $('#preview').attr('src', e.target.result); 
        } 
       reader.readAsDataURL(this.files[0]);      
       } 
      }) 
     fileuploader.trigger('click'); 
    }

當我選擇從上傳對話框的文件也能正常工作。但是，當我點擊「取消」或沒有選擇任何文件就退出上傳器時，出現下面的錯誤。

Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.

如何解決這個問題？

來源

2015-07-11 Senthil Kumar J

How to solve this problem??

不要叫show_image當用戶選擇取消

function show_image(image) {    
     if (image && image[0] && this.files.length) { 
      var reader = new FileReader();    
      reader.onload = function (e) { 
       $('#preview').attr('src', e.target.result); 
      } 
      reader.readAsDataURL(this.files[0]);      
     } 
}

來源

2015-07-11 12:17:26

上述檢查的條件image && image[0]它（如果我們的猜測是沒有更多的代碼正確解釋它）檢查這個變量是不可-空值。

但是你在this.files[0]調用readAsDataURL();這個變量與image無關，很可能你沒有設置它，或者當用戶按下取消時它不是文件名。

沒有更多的代碼，我們無法猜出更準確的答案...

來源

2015-07-11 12:21:49 herchu

FileReader在沒有選擇文件的情況下無法工作

回答

相關問題