最近做一個小項(xiàng)目，前端需要有一個功能是點(diǎn)擊某按鈕時(shí)，彈出文件選擇的框，然后獲取目錄并寫入對應(yīng)的輸入框里，以往是選擇某個文件進(jìn)行上傳，功能看起來有些像，但這次不同的是只能選擇某個目錄而不是文件，因?yàn)樗⒉皇巧蟼鳎皇菫榱诉x擇后臺生成的文件保存的路徑。
于是網(wǎng)上查解決方案，查到兩種，
一種是僅在谷歌瀏覽器上有效的方式，在input節(jié)點(diǎn)里加一個屬性?webkitdirectory，就可以實(shí)現(xiàn)點(diǎn)擊彈出選擇目錄的功能，然后就可以截取目錄，此種方式對非空文件夾是可以的實(shí)現(xiàn)的，只需監(jiān)聽此input的change事件即可，但如果選擇的是空文件夾，就不會觸發(fā)事件，就無法獲取路徑，所以這方法不復(fù)合我的需求。
另一種是只適用于IE瀏覽器的方式，即調(diào)用IE的activeX控件，為點(diǎn)擊按鈕綁定事件，然后就可以獲取目錄，然后到目錄調(diào)到想要的地方即可，具體實(shí)現(xiàn)方式是：
<input id="show">
<button onclick="clickBtn()">點(diǎn)擊</button>
function?click()?{
????try?{
????????var?Message?=?"\u8bf7\u9009\u62e9\u6587\u4ef6\u5939";?//選擇框提示? ? ? ? ????????var?Shell?=?new?ActiveXObject("Shell.Application");
????????var?Folder?=?Shell.BrowseForFolder(0,?Message,?64,?17);?//起始目錄為：我的電腦? ? ? ? ????????//var?Folder?=?Shell.BrowseForFolder(0,?Message,?0);?//起始目錄為：桌面? ? ? ? ????????if?(Folder?!=?null)?{
????????????Folder?=?Folder.items();?//?返回?FolderItems?對象? ? ? ? ? ??
????????????Folder?=?Folder.item();?//?返回?Folderitem?對象????????????
????????????Folder?=?Folder.Path;?//?返回路徑????????????
????????????if?(Folder.charAt(Folder.length?-?1)?!=?"\\")?{
????????????????Folder?=?Folder?+?"\\";
????????????}
????????????document.getElementById('show').value?=?Folder;
????????????return?Folder;
????????}
????} catch?(e)?{? alert(e.message); }
}
但些方式也有一個問題是，此控件是默認(rèn)關(guān)閉的，需要用戶手動啟用，并且要把本站點(diǎn)加入可信任站點(diǎn)才行，具體設(shè)置過程是：
1. 單擊菜單工具->Internet選項(xiàng)->安全->受信任站點(diǎn)->站點(diǎn)->把此網(wǎng)站設(shè)為可信站點(diǎn)
2. 在自定義級別->對沒有標(biāo)記為安全的ActiveX控件進(jìn)行初始化和腳本運(yùn)行"----"啟用"
