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

转载一篇好文章js实现动态添加和删除多个附件。

2014-09-05 12:08 567 查看

js 实现动态添加多个附件

博客分类：
javascript

JSP Struts Java HTML

效果图

代码：

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

<%@taglib prefix="s" uri="/struts-tags"%>

<%

String path = request.getContextPath();

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

%>

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

<html>

<head>

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

<title>My JSP 'upload.jsp' starting page</title>

<script type="text/javascript">

function AddMore(){

var more = document.getElementById("file");

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

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

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

input.type = "file";

input.name = "file";

button.type = "button";

button.value = "删除";

more.appendChild(br);

more.appendChild(input);

more.appendChild(button);

button.onclick = function(){

more.removeChild(br);

more.removeChild(input);

more.removeChild(button);

};

}

</script>

</head>

<body>

<s:form action="upload" method="post" theme="simple" enctype="multipart/form-data">

<table border="1" width="50%">

<tr>

<td>用户名:</td>

<td><s:textfield name="username" label="用户名"></s:textfield></td>

</tr>

<tr>

<td>附件:</td>

<td id="file">

<s:file name="file" label="文件"></s:file>

<input type="button" value="增加附件" onclick="AddMore()">

</td>

</tr>

<tr>

<td colspan="2" align="center">

<s:submit value="提交" ></s:submit></td>

</tr>

</table>

</s:form>

</body>

</html>

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

标签：

相关文章推荐

新的分享

章节导航