使用Javascript/Asp.net

上傳之前獲取文件的高度寬度我有天冬氨酸：在我的網頁表單FileUpload控件。使用Javascript/Asp.net

在的OnChange（）事件的FileUpload控制，執行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（）函數應該閱讀選擇的文件，並上傳到服務器之前獲得高度，寬度和大小的文件。

如何可以做到這一點？我做錯了什麼。

來源

2014-11-25 AMIT SHELKE

什麼是'_file'的價值？ – TryingToImprove 2014-11-25 09:03:38

用戶機器...除權任何本地文件路徑：「C：\用戶\ amit_shelke \圖片\ as.jpg」 – 2014-11-25 09:07:46

你確定它是不是'C：/ fakepath/as.jpg'？ – TryingToImprove 2014-11-25 09:49:38

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"> 
}

來源

2014-11-25 10:10:25 Vaibhav

您的解決方案無法正常工作。謝謝你的嘗試。 img.onload（）沒有觸發。 – 2014-11-25 10:23:20

哦，我只是忘了把img.src，現在試試我已經更新了我的代碼。 – Vaibhav 2014-11-25 10:26:13

-1

做你嘗試沒有image.src = '文件：//' + _file;

var img = new Image; 

img.onload = function() { 
    alert(img.width); 
    alert(img.height); 
}; 
img.onerror = function() { 
    alert("error"); 
}; 
img.src = oFile.value;

來源

2014-11-25 09:01:51 Vaibhav

是的，已經嘗試過你的建議，但沒有工作。其實警報（img.width）應該給我確切的價值，但事實並非如此。究其原因可能是我，可能需要創建的FileReader類的對象，並把它傳遞給圖片類，那麼你的代碼可以工作，但我是新來的JavaScript所以找不到我需要寫什麼確切的代碼。 – 2014-11-25 09:54:28

我已經發布了另一個答案，我已經改變了callme和ReadImage函數，它現在應該可以工作。 – Vaibhav 2014-11-25 10:11:38

我的問題剩下的部分 -

使用「上傳之前獲取文件大小」這個JavaScript

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; 
}

來源

2014-11-25 13:29:34

使用Javascript/Asp.net

回答

相關問題