亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

HTML5新特性之type=file文件上傳功能

  發(fā)布時(shí)間：2018-02-02 11:23:49   作者：佚名   我要評(píng)論
這篇文章主要介紹了HTML5新特性之type=file文件上傳功能,需要的朋友可以參考下

1、語法

<input name="myFile" type="file">

2、屬性（以下三個(gè)僅HTML5支持，因此存在兼容性問題）

（1）multiple ：表示用戶是否可以選擇多個(gè)值。multiple只能用于type=file和type=email。

（2）accept：服務(wù)器接受的文件類型，否則將被忽略。

音頻/ *代表聲音文件。僅HTML5支持
視頻/ *代表視頻文件。僅HTML5支持
圖像/ *表示圖像文件。僅HTML5支持

（3）required：此屬性指定用戶在提交表單之前必須填寫一個(gè)值。

3、獲取上傳的文件信息

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>file multiple</title>
    </head>
    <body>
        <input type="file" multiple="multiple" id="test">
        <p id='content'></p>
        <script type="text/javascript">
            var test = document.getElementById('test');
            test.addEventListener('change', function() {
                var t_files = this.files;
                var str = '';
                for(var i = 0, len = t_files.length; i < len; i++) {
                    console.log(t_files[i]);
                    str += '<a href="javascript:void(0)">' + t_files[i].name + '</a><br/>';
                };
                document.getElementById('content').innerHTML = str;
            }, false);
        </script>
    </body>
</html>

顯示：

更具體使用見MDN：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file

總結(jié)

以上所述是小編給大家介紹的HTML5新特性之type=file文件上傳功能，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

相關(guān)文章

  • HTML5拖拽文件上傳的示例代碼

    這篇文章主要介紹了HTML5拖拽文件上傳的示例代碼,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)
    2021-03-04

  • HTML5 拖拽批量上傳文件的示例代碼

    這篇文章主要介紹了HTML5 拖拽批量上傳文件的示例代碼的相關(guān)資料,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2018-03-28

  • HTML5 文件上傳下載的實(shí)例代碼

    HTML5 中提供的文件API在前端中有著豐富的應(yīng)用，上傳、下載、讀取內(nèi)容等在日常的交互中很常見。而且在各個(gè)瀏覽器的兼容也比較好，包括移動(dòng)端，除了 IE 只支持 IE10 以上的
    2017-07-03

  • Html5實(shí)現(xiàn)文件異步上傳功能

    本文簡(jiǎn)單介紹利用Html5的FormData實(shí)現(xiàn)文件的異步上傳，還可以實(shí)現(xiàn)上傳進(jìn)度條和文件大小驗(yàn)證等，代碼簡(jiǎn)單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的的朋友參考下吧
    2017-05-19

  • HTML5拖拉上傳文件的簡(jiǎn)單實(shí)例

    本篇文章主要介紹了HTML5拖拉上傳文件的簡(jiǎn)單實(shí)例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2017-01-11

  • 使用Html5實(shí)現(xiàn)異步上傳文件,支持跨域,帶有上傳進(jìn)度條

    下面小編就為大家?guī)硪黄褂肏tml5實(shí)現(xiàn)異步上傳文件,支持跨域,帶有上傳進(jìn)度條。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2016-09-17

  • 移動(dòng)端HTML5實(shí)現(xiàn)文件上傳功能【附代碼】

    下面小編就為大家?guī)硪黄苿?dòng)端HTML5實(shí)現(xiàn)文件上傳功能【附代碼】。小編覺得聽錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
    2016-03-25

  • html5實(shí)現(xiàn)多文件的上傳示例代碼

    多文件的上傳在以前或許實(shí)現(xiàn)起來會(huì)很復(fù)雜，不過自從html5的出現(xiàn)，讓其變得非常容易，下面有個(gè)不錯(cuò)的示例，大家可以參考下
    2014-02-13

  • HTML5實(shí)現(xiàn)同時(shí)選擇多個(gè)文件夾上傳的使用示例

    HTML5的上傳API可以支持同時(shí)選擇多個(gè)文件和選擇單個(gè)文件夾，但不支持同時(shí)選擇多個(gè)文件夾，本文就來實(shí)現(xiàn)一下HTML5實(shí)現(xiàn)同時(shí)選擇多個(gè)文件夾上傳的使用示例，具有一定的參考價(jià)
    2023-09-28

最新評(píng)論