效果图
代码:
<%@ 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>
分享到:
相关推荐
在JavaScript(JS)编程中,动态添加附件效果通常是指在网页上通过JavaScript代码实现动态创建、编辑或删除文件上传的功能。这种效果可以让用户在不刷新页面的情况下,方便地添加、预览和管理上传的文件,提高了用户...
通过分析标签"多附件添加"、"仿163附件添加"和"添加多个附件",我们可以深入探讨这个功能的核心技术点和实现步骤。 首先,我们需要理解多附件上传的基本原理。在Web应用中,用户通常通过点击一个“添加附件”按钮来...
本资源提供了一款基于JavaScript实现的多附件上传表单添加类库的源码和示例程序,这对于开发者来说是一个很好的学习和实践工具。 首先,让我们深入理解JavaScript在多附件上传中的作用。JavaScript是一种客户端脚本...
添加一个或多个附件至邮件。注意路径应为有效且可访问的。 9. **发送邮件并检查返回值**: ```javascript var ret = jMail.Send("smtp.126.com"); if (ret == false) { alert('fail'); } else { alert('...
创建一个名为`流程附件图片js.js`的脚本文件,这里主要编写JavaScript代码来处理图片的预览功能。这部分代码需要与泛微E9的API进行交互,获取到IMAGEDOCID对应的图片资源,并且在前端展示出来。同时,为了提供更好...
总结来说,动态添加附件并上传文件是一个涉及前端交互、文件处理、数据传输和后端存储等多个环节的复杂过程。开发者需要熟练掌握JavaScript、HTML5以及服务器端语言,才能实现这样一个功能,并确保其安全性和用户...
js实现页面上传附件,和网易邮箱添加附件差不多一个效果。可以支持上传多个
这个项目"js+html+css 实现带有进度条多附件依次上传"是针对这一需求的一个实践练习,它结合了JavaScript、HTML和CSS三种技术来创建一个用户友好的多文件上传功能,并且在上传过程中显示进度条,提升用户体验。...
为了实现动态添加附件的用户界面,我们需要一个表单(form),该表单需要设置为支持文件上传的`multipart/form-data`编码类型。在这个表单中,我们通常需要一些隐藏字段来存储与用户会话或者操作相关的数据。接着,...
总结一下,实现JavaScript动态增加文件域并模仿网易邮箱附件功能的关键步骤包括: 1. 使用DOM操作创建`<input type="file">`元素。 2. 将新创建的文件域插入到页面适当位置。 3. 添加`change`事件监听器,以便在用户...
本实例的压缩包可能包含了实现上述功能的HTML、CSS和JavaScript代码,你可以通过学习和调试这些代码,更深入地理解如何在实际项目中实现jQuery动态添加多附件上传。记住,实践是检验真理的唯一标准,不断尝试和改进...
***实现多附件上传的代码涉及到前端JavaScript以及后端的***处理技术,能够实现在网页上动态地添加多个文件上传控件,允许用户上传多个文件。这种实现方式在功能上类似于常见的邮件系统或网盘服务中的多文件上传功能...
"jquery实现多附件上传"这个主题涉及到的是利用jQuery来创建一个功能,允许用户在网页上选择并上传多个文件。这在现代网页应用中是非常常见的需求,比如论坛、社交媒体或者在线协作平台。 在jQuery中实现多附件上传...
4. **性能优化**:对于上传多个附件的情况,要考虑到用户上传操作的性能影响,并尽可能优化前端的处理逻辑。 5. **代码组织**:将JavaScript代码组织到合适的模块或类中,避免直接在HTML标签内使用`onclick`等内联...
这个主题“上传多个附件的js及相关”主要关注如何使用JavaScript(js)技术来实现这一功能。JavaScript是一种客户端脚本语言,它允许我们在用户的浏览器上运行代码,为网页添加交互性。下面将详细介绍这个知识点,并...
标题 "c# ,js请高手帮忙在附件源码里添加上传进度显示" 暗示我们需要探讨的是如何在C#后端与JavaScript前端之间实现文件上传时的进度显示功能。这个功能常见于Web应用中,它能提升用户体验,让用户了解文件上传的...
2. 删除标志:为每个附件添加一个删除按钮,当用户点击删除时,发送Ajax请求到服务器,确认后从服务器和数据库中移除文件。同时,更新前端的显示列表。 3. 安全考虑:在删除和编辑操作中,务必确保有适当的权限控制...
在JavaScript(简称JS)中实现上传附件功能是一项...综上所述,"js上传附件"涉及到了前端开发中的文件操作、事件处理、异步通信、错误处理以及用户体验优化等多个方面,而具体的实现细节则取决于项目的具体需求和设计。
在JavaScript的世界里,实现文件上传功能是一个常见的需求,尤其是在现代Web应用中。传统的文件上传通常依赖于Flash技术,但随着HTML5的普及,JavaScript已经能够提供原生的、无插件的文件上传解决方案。本教程将...