getAsDataURL（）不工作鉻和IE

Question

這是我的HTML：

<input type="file" id="browse" name="browse" size="" placeholder="Photo" checked="checked" class="upload"/> 
<input type="button" onclick="javascript:onbrowse()" class="unknown" value=""/> 

而且我的JavaScript：

$(function() { 
     $(".upload").change(function() { 
      var fileObj = $(this).get(0); 
      var fileName; 
      if (fileObj.files) { 
       fileName = fileObj.files.item(0).getAsDataURL() 
      } else { 
       fileName = fileObj.value; 
      } 
      $(".unknown").css("background-size", "100px 100px"); 
      $(".unknown").css("background-image", "url(" + fileName + ")"); 
     }); 
    }); 

    function onbrowse() { 
     document.getElementById('browse').click(); 
    } 

我有兩個問題：

1. 的onclick不適用於Chrome和

2. getAsDataURL（）在Chrome和IE中不起作用

你能幫我嗎？

Answer 1

IE行爲，尚不支持文件API。無論如何，你需要使用FileReader來讀取文件。此外，該文件不是它的文件名（您的變量命名有點模糊）。

對文件輸入的單擊委派工作得很好。

http://jsfiddle.net/fKQDL/

file = fileObj.files[0]; 
var fr = new FileReader; 
fr.onloadend = changeimg; 
fr.readAsDataURL(file); 

Answer 2

綁定按鈕的使用jQuery

jQuery('input[type="button"].unknown').click (onbrowse);