动态添加文件的输入项

来源:互联网 发布:ecowater净水器知乎 编辑:程序博客网 时间:2024/05/17 02:25

动态添加文件的输入项

<%@ page language="java"import="java.util.*" pageEncoding="utf-8"%>

<%

String path =request.getContextPath();

String basePath =request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN">

<html>

  <head>

    <base href="<%=basePath%>">

   

    <title>上传页面</title>

   

    <meta http-equiv="pragma" content="no-cache">

    <meta http-equiv="cache-control" content="no-cache">

    <meta http-equiv="expires" content="0">   

    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

    <meta http-equiv="description" content="This is my page">

    <!--

    <link rel="stylesheet"type="text/css" href="styles.css">

    -->

<script type="text/javascript">

function addfile(){

    var files = document.getElementById("files");

   

    var input = document.createElement("input");

    input.name="file";

    input.type="file";

   

    var delButton = document.createElement("input");

    delButton.type="button";

    delButton.value="删除";

   

    delButton.onclick=function del(){

       this.parentNode.parentNode.removeChild(this.parentNode);

       }

   

   

    var div = document.createElement("div");

    div.appendChild(input);

    div.appendChild(delButton);

   

    files.appendChild(div);

}

   

</script>

  </head>

 

  <body>

   <form action="${pageContext.request.contextPath }/servlet/UploadServlet2" enctype="multipart/form-data" method="post" >

<table>

    <tr>

       <td>

           用户名:

       </td>

       <td>

           <input type="text"name="username" >

       </td>

    </tr>

    <tr>

       <td></td>

       <td>

           <input type="button"value="添加文件" onclick="addfile()">

       </td>

    </tr>

    <tr>

       <td></td>

       <td>

           <div id="files"></div>

       </td>

    </tr>

    <tr>

       <td></td>

       <td>

           <input type="submit"value="上传文件" >

       </td>

    </tr>

</table>

</form>

  </body>

</html>

 

原创粉丝点击