您的位置：首页 > Web前端 > HTML

[置顶] 文件上传简介1---上传到指定的目录2

2013-05-08 15:23 323 查看

节摘要：上节解决了上传文件到本机指定目录，本节主要是在上节的基础上对前台显示的html页面做一下修改，实现动态的增加文件输入框s。

新建upload2.html（放在和upload.html文件的同一个目录下）

代码如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  <html>    <head>      <title>upload2.html</title>            <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">      <meta http-equiv="description" content="this is my page">      <meta http-equiv="content-type" content="text/html; charset=UTF-8">            <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->    <script>   function mCreateFile(obj){   var eF   var mName     mFileName.innerHTML=""   if (obj.id=="File") {        mstatus.innerHTML="总共有 <b>"+(mFile.children.length-1)+"</b> 个文件等待上传"     for (i=0;i<mFile.children.length-1;i++)       {   if (mFile.children.value=="") {                 mFile.removeChild(mFile.children)         }   else         {           mName=mFile.children.value.split("\\")           mFileName.innerHTML+="<div id=NameDetail title='"+mName[mName.length-1]+"'>"+mName[mName.length-1]+"</div>"         }       }       }       if (obj.id=="File_New") {     eF=document.createElement('<input type="file" name="File" size="23" id=File_New onpropertychange="mCreateFile(this)">')     mFile.appendChild(eF)     obj.id="File"     }   }   </script>   <style>   table{   FILTER: progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#999999,strength=3);   }   input{   border:1px soild #000000;   font-family:Verdana,Arial,宋体;   font-size:12px;   padding:2px;   }   #mTD{     LINE-HEIGHT: 24px;   }   #mFile{   width:203px;   float:left;   |   #mFileName{   float:right;   width:182px;   }   #NameDetail{   overflow:hidden;   width:176px;   color:#000000;   font-family:Verdana,Arial,宋体;   font-size:12px;   cursor:default;   height:22px;   }   #mstatus{   font-size:12px;   color:#ff0000;   }   </style>     </head>      <body>       <form name="uploadform" method="POST" action="upload"              ENCTYPE="multipart/form-data">  <div align="center">   <table border="1" width="420" style="border-collapse: collapse" bordercolor="#0066cc" cellpadding="4" bgcolor="#D0F0FF">   <tr>   <td bgcolor="#3399FF" height="26" align="center"><font color="#FFFFFF" size="3"><b>添加附件</b></font></td>   </tr>   <tr>     <td id=mTD>   <div id=mFile><input type="file" name="File" size="23" id=File_New onpropertychange="mCreateFile(this)"></div>   <div id=mFileName></div>           <div id=mstatus>总共有 <b>0</b> 个文件等待上传</div>           </td>   </tr>   </table>                       <div id="upload">                                  <input name="upload" type="submit" value="开始上传" />                      </div>  </div>   </form>   </body>

访问的url如下： http://localhost:8080/UpDown/upload2.html 运行截图1：

截图2：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 上传 HTML 文件上传

相关文章推荐

新的分享

章节导航