2012-05-01 125 views
4

我有用戶可以上傳文件的網頁。 他可以使用<t:inputFileUpload>​​標籤選擇要上傳的文件(該標籤與標準HTML輸入標籤type="file"一樣)。在瀏覽器中預覽本地html文件

我想添加預覽功能。

當用戶選擇一個文件(例如:html文件)時,他可以預覽他的html本地文件。

我知道有瀏覽器的安全限制原因存在「問題」。

我的第一個解決方案是將文件從用戶本地計算機加載到服務器,然後在服務器上創建指向該文件的鏈接。問題是,我的服務器上有風險, 也許這個文件已損壞...

任何人有一個想法和解決方案,這個未來?

回答

5

這是一個簡單的JSFiddle,它顯示html文件的預覽。我從教程here創建它。

你的代碼的最有用的部分是以下

var f = // uploaded file. 
var reader = new FileReader(); 
// Closure to capture the file information. 
reader.onload = (function(theFile) { 
    return function(e) { 
     // Render the file. 
     $("#preview").html(e.target.result); 
    }; 
})(f); 

// Read in the html file as text. 
reader.readAsText(f); 

這將使用HTML5 FileReader來讀取並顯示html文件的內容。

+0

我會檢查並返回。謝謝! – lolo

+0

@lolo只是更新它,刪除一些不必要的和誤導性的代碼。 –

+0

好的,謝謝...... – lolo