改變文件域的樣式實現(xiàn)思路同時兼容ie、firefox
更新時間：2013年10月23日 17:10:58 作者：
正如標題所言只是模擬了file文件域的外觀，其實起作用的還是文件域file，這樣就很方便，感興趣的朋友可以了解下
復制代碼 代碼如下:
<body>
<input type=file id="j" onchange="getValue();" style="-moz-opacity:0;filter:alpha(opacity=0);opacity:0;position:absolute;left:166px;" />
<input id="ye" style="color: green;border: 1px solid green;width:300px;" />
<input type="button" value="File" style="border: 1px solid green;width:80px;" />
</body>
<script language="javascript">
function getValue(){
document.getElementById('ye').value = document.getElementById('j').value;
}
</script>
思路：
1、把頑固的文件域就是<input type=file /> 透明化：style="-moz-opacity:0;filter:alpha(opacity=0);opacity:0;"
2、用一個文本框和按鈕代替文件與的外觀
3、將文件域的瀏覽按鈕放到我們寫的按鈕的上方
4、用js得到文件域value改變時的值即：得到的文件路徑，并賦給文本框的value，這樣就ok了
我只是試驗，樣式很簡陋；其實可以進一步美化；
這樣的好處：只是模擬了file文件域的外觀，其實起作用的還是文件域file，這樣就很方便。
相關文章
理解javascript中的回調函數(shù)(callback)
這篇文章主要介紹了理解javascript中的回調函數(shù)(callback),本文著重于對回調函數(shù)概念的理解,需要的朋友可以參考下2014-09-09
這篇文章主要給大家介紹了關于微信小程序實現(xiàn)錄音時的麥克風動畫效果的相關資料，文中通過示例代碼介紹的非常詳細，對大家學習或者使用微信小程序具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧2019-05-05
本文主要介紹了微信小程序實現(xiàn)觸底加載與下拉刷新的示例代碼，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-05-05
這篇文章主要介紹了JS閉包的學習心得，以及分析其中遇到的問題，需要的朋友跟著參考下吧。2018-04-04
本文主要介紹了ie下js不執(zhí)行的幾種可能，具有很好的參考價值，下面跟著小編一起來看下吧2017-02-02
這篇文章主要介紹了利用JavaScript的Map提升性能的方法詳解,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-08-08
JavaScript實現(xiàn)的3D旋轉魔方動畫效果實例代碼
在本篇文章里小編給大家整理了關于JavaScript實現(xiàn)的3D旋轉魔方動畫效果實例代碼，有興趣的朋友們測試下。2019-07-07
這篇文章主要為大家詳細介紹了JavaScript的運動函數(shù)，使用實例在論證，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
最近使用echarts做的一個H5的成績數(shù)據報告,里面使用了雷達圖已經折線圖和柱狀圖,下面這篇文章主要給大家介紹了關于如何利用echarts畫雷達圖和折柱混合的相關資料,需要的朋友可以參考下2022-04-04
這篇文章主要為大家詳細介紹了原生js實現(xiàn)表格循環(huán)滾動，每次滾動一行停頓，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-11-11