HTML5開發之通過檔案物件選擇檔案

2021-07-24 14:32:41 字數 764 閱讀 8586

在html中新增了兩個與表單相關的api——檔案api與拖放api。拖放api可以實現一些有趣的功能,允許使用者拖放選項並將其放置到瀏覽器中的任何地方。其很好地體現了html5作為web應用程式規範的思路,使得開發者可以從桌面計算機中借用更多功能。

在html5裡,從web網頁上訪問本地檔案系統變得十分簡單,那就是使用檔案api。這個file規範裡提供了乙個api來表現web應用裡的檔案物件。使用者可以程式設計來選擇它們,訪問它們的資訊。

在html4中,file控制項內只允許放置乙個檔案,但是到了html5中,filel—ist物件表示使用者選擇的檔案列表,通過新增multiple屬性,在file控制項內允許一次放置多個檔案。控制項內的每乙個使用者選擇的檔案都是乙個file物件,而filelist物件則為這些file物件的列表,代表使用者所選擇的所有檔案。

file物件有兩個屬性,name屬性表示檔名,不包括路徑,lastmodifieddate屬性表示檔案的最後修改日期。

在本例中通過單擊「瀏覽」按鈕,選擇要上傳的檔案,然後單擊「上傳檔案」按鈕,將會彈出乙個對話方塊,這個對話方塊將顯示上傳檔案的名稱。**如下:

filelist與file例項</title> 

</head>

function showname()  

var file;  

//返回filelist檔案列表物件      

for  (var i=0;  i  

選擇檔案:  

();」value=」上傳

html5開發案例關注h5edu教育html5開發原始碼

HTML5學習之 HTML 5 拖放

拖放 drag 和 drop 是 html5 標準的組成部分。拖放是一種常見的特性,即抓取物件以後拖到另乙個位置。在 html5 中,拖放是標準的一部分,任何元素都能夠拖放。internet explorer 9 firefox opera 12 chrome 以及 safari 5 支援拖放。注釋...

html5開發之viewport使用

隨著高階手機 andriod,iphone,ipod,winphone等 的盛行,移動互聯應用開發也越來越受到人們的重視,用html5開發移動應用是最好的選擇。然而,每一款手機有不同的解析度,不同螢幕大小,如何使我們開發出來的應用或頁面大小能適合各種高階手機使用呢?學習html5 viewport的...

html5開發之viewport使用

隨著高階手機 andriod,iphone,ipod,winphone等 的盛行,移動互聯應用開發也越來越受到人們的重視,用html5開發移動應用是最好的選擇。然而,每一款手機有不同的解析度,不同螢幕大小,如何使我們開發出來的應用或頁面大小能適合各種高階手機使用呢?學習html5 viewport的...