HTML5之文件选择器

<!DOCTYPE html>

<html>

  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <style>

       #outline {border:5px #666600 outset;padding:10px;}

    </style>

    <script src="jquery-1.10.2.min.js"></script>

    <script type="text/javascript">

       $(function(){

         $("input:file").on('change',function(event){

           for(var i=0;i<event.target.files.lenght;i++){

              $('#message').append(file.name+"<br>");

           }

         });

       })

    </script>

  </head>

  <body>

     <div id="outline">

        <h1>选择文件</h1>

           <input type="file" accept="image/*" multiple/>

           <div id="message"></div>

     </div>

  </body>

</html>

相关推荐