js實現(xiàn)點擊按鈕彈出上傳文件的窗口
更新時間：2016年12月23日 08:25:28 作者：一個弱者想變強
本文主要介紹了js實現(xiàn)點擊按鈕彈出上傳文件的窗口的實例方法。具有很好的參考價值，需要的朋友一起來看下吧
1.詳細(xì)描述
在頁面上設(shè)置一個“選擇文件”按鈕，點擊該按鈕，會彈出本地磁盤信息用于選擇文件。
2.代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Demo</title>
<script type="text/javascript">
function F_Open_dialog()
{
document.getElementById("btn_file").click();
}
</script>
</head>
<body>
<div>
<input type="file" id="btn_file" style="display:none">
<button type="button" onclick="F_Open_dialog()">選擇文件</button>
</div>
</body>
</html>
3.操作示例
將代碼復(fù)制到W3CSchool的測試頁面，提交運行之后如圖：在查看結(jié)果頁面會出現(xiàn)“選擇文件”這個按鈕
之后點擊“選擇文件”后如圖：頁面上會出現(xiàn)彈窗，顯示本地磁盤信息，用于選擇文件。
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
相關(guān)文章
這篇文章主要為大家介紹了如何利用JS實現(xiàn)消消樂小游戲,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-04-04
使用JavaScript實現(xiàn)一個簡單的哈希映射功能
哈希表大家應(yīng)該都經(jīng)常用到吧,那么大家有沒有想過哈希表是怎么實現(xiàn)的呢,本文我們就來從一道簡單的題目來了解一下哈希表的簡單原理和實現(xiàn)吧2024-02-02
本文對JavaScript事件加載進行了一些延伸思考。加載多個事件時，使用window.onload可能會導(dǎo)致一些不便，而通過偵聽器等方法，則可以解決這些問題。2009-12-12
這篇文章主要介紹了JavaScript DOM事件(筆記) ,需要的朋友可以參考下2015-04-04
這篇文章主要介紹了js控制輸入框獲得和失去焦點時狀態(tài)顯示的方法,可實現(xiàn)判斷輸入框的焦點狀態(tài)設(shè)置不同樣式的功能,是非常實用的技巧,需要的朋友可以參考下2015-01-01
這篇文章主要介紹了JS實現(xiàn)的模仿QQ頭像資料卡顯示與隱藏效果,涉及javascript鼠標(biāo)事件響應(yīng)及頁面元素屬性動態(tài)操作相關(guān)技巧,需要的朋友可以參考下2017-04-04
Map和WeakMap都是ES6中新增的數(shù)據(jù)結(jié)構(gòu),它們的主要區(qū)別在于鍵的作用域和鍵的類型,本文就通過代碼示例給大家詳細(xì)介紹了JavaScript鍵的作用域和類型,需要的朋友可以參考下2023-08-08
npm安裝依賴時出現(xiàn)Peer Dependencies沖突報錯解決分析
這篇文章主要為大家介紹了npm安裝依賴時出現(xiàn)Peer Dependencies沖突報錯解決分析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-09-09
前端使用JavaScript結(jié)合CSS實現(xiàn)3D旋轉(zhuǎn)跟隨鼠標(biāo)變化
這篇文章主要介紹了前端使用JavaScript結(jié)合CSS實現(xiàn)3D旋轉(zhuǎn)跟隨鼠標(biāo)變化，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2023-01-01
本文主要介紹js中call與apply關(guān)鍵字的作用以及它們的用法,具體實例如下,希望對大家有所幫助2016-11-11