在使用<input id="file_upl" type="file" />控件上傳文件時(shí),，有時(shí)會(huì)需要獲取文件本地路徑展示給客戶，這時(shí)可以通過這樣的方式獲取文件本地路徑：

document.getElementById('file_upl').value

這在IE7及以前的IE瀏覽器版本上都沒有問題,，但是到IE8上面,，就不行了，在IE8中你只會(huì)獲取到這樣的路徑："C:\fakepath\xxx”,，其中xxx是你的文件名,。

這是怎么回事呢？

原來,，IE8出于安全性的考慮,，上傳文件時(shí)屏蔽了真實(shí)的本地文件路徑，而以“C:\fakepath\”取代之,。

但是我們就是想要獲取真實(shí)的本地文件路徑怎么辦呢,？

你可以通過設(shè)置瀏覽器安全選項(xiàng)得到真實(shí)路徑：

Internet選項(xiàng) -> 安全 -> 自定義級(jí)別 -> 將本地文件上載至服務(wù)器時(shí)包含本地目錄路徑 -> 選“啟動(dòng)” -> 確定

但是，作為開發(fā)者,，我們不能指望客戶去這么做,，所以我們必須通過代碼解決這個(gè)問題。

例如我的上傳文件控件的HTML代碼是：

<input id="file_upl" type="file" />

那么在JS代碼中我就可以這樣來獲取真實(shí)的文件路徑：

var file_upl = document.getElementById('file_upl');
file_upl.select();

var realpath = document.selection.createRange().text;

如果我們用的是Ext,，那么我們會(huì)使用Ext.ux.form.FileField組件,，假設(shè)我們賦給它的id是"file_upl"，這時(shí)同樣會(huì)產(chǎn)生上面的問題，解決的辦法也是一樣,，但是我們獲取到type為file的input才行,，而根據(jù)"file_upl"獲取到的元素根本不是我們所需要的，Ext是自動(dòng)生成了一個(gè)type為file的input,，你可以通過DebugBar或其他類似工具看到這個(gè)input,，它的id是賦給Ext.ux.form.FileField的id加上"-file"的后綴，也就是"file_upl-file",，所以獲取真實(shí)文件路徑的JS代碼就是：

var file_upl = document.getElementById('file_upl-file');
file_upl.select();

var realpath = document.selection.createRange().text;

此方案只針對(duì)IE瀏覽器,，對(duì)其他瀏覽器暫時(shí)未作探討。

via：yunzhu