js动态添加文件上传框

页面元素添加为

<tr id="att" style="display:none;">

<td style="text-align:right;">附件文件:</td>

<td>

<div id="div_fujian">

<div class="input-outer"><input type="file" class="tuiTrim input" name="fujian" size="30" maxlength="15" id="fujian" tabindex="1"/></div>

</div>

<input type="button" id="btn_add2" value="增加附件" >

</td>

</tr>

js方法为:

j = 1;

$("#btn_add2").click(function(){

document.getElementById("div_fujian").innerHTML+=‘<div id="div_fujian‘+j+‘"><div class="input-outer"><input  name="fujian‘+j+‘" id="fujian‘+j+‘" type="file" class="tuiTrim input" size="30" maxlength="15" tabindex="1"/><input type="button" value="删除"

j = j + 1;

});

});//end seajs.use

function del_fujian(o){

document.getElementById("div_fujian").removeChild(document.getElementById("div_fujian"+o));

}

时间: 2024-11-08 22:20:55

js动态添加文件上传框的相关文章

ajaxFileUpload+struts2实现多文件上传(动态添加文件上传框)

上篇文章http://blog.csdn.net/itmyhome1990/article/details/36396291介绍了ajaxfileupload实现多文件上传, 但只是固定的文件个数,如果需求不确定是多少文件 则我们就需要动态的添加文件上传框,以实现灵活性. 基于上篇基本框架是不变的,主要修改以下几个方面 1.jQuery实现动态添加删除文件上传框 2.获取文件上传框的ID 3.ajaxfileupload.js里将ID数组转换为需要的Object数组 依次解决上面问题 一.实现动

使用JS实现页面中动态添加文件上传输入项

1. 编写JSP 1 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> 2 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 3 <html> 4 <head> 5 <title>My JSP 'uplo

html 文件上传框 input标签

文件上传框 有时候,需要用户上传自己的文件,文件上传框看上去和其它 文本域差不多,只是它还包含了一个浏览按钮.访问者可以通 过输入需要上传的文件的路径或者点击浏览按钮选择需要上传 的文件. 代码格式:<input type=“file” name=“...” size=“15” input enctype="multipart/form-data“ maxlength=“100”> 属性解释: 属性解释: type=“file”定义文件上传框: name属性定义文件上传框的名称,要保

【PHP原生】动态多文件上传并将路径存储在数据库

动态多文件上传并将路径存储在数据库 1.上传页面index.html <!DOCTYPE html > <html> <head> <metahttp-equiv="Content-Type"content="text/html; charset=utf-8"/> <title>多图片上传</title> <script> //全局变量,代表文件域的个数,并用该变量区分文件域的nam

JavaScript进阶 九 JS实现本地文件上传至阿里云服务器

JS实现本地文件上传至阿里云服务器 前言 在前面的博客< JavaScript进阶(八)JS实现图片预览并导入服务器功能>(点击查看详情)中,实现了JS将本地图片文件预览并上传至阿里云服务器的操作.这次需要实现将本地打包好的文件上传至阿里云服务器.使用前面的图片文件上传方法无法完成此操作.操作界面如下: 思路 本地与服务端传输文件的格式应该是熟悉的Base64格式.首先需要将本地文件转换为Base64格式,传输至服务端后,在服务端再将Base64格式的文件转换为原始文件. 源码解析 控制器 /

Node.js 博客实例(三)添加文件上传功能

原教程 https://github.com/nswbmw/N-blog/wiki/_pages的第三章 上传文件眼下有三种方法: 使用 Express 自带的文件上传功能,不涉及数据库 使用 Formidable 外部模块,不涉及数据库 上传到 MongoDB ,涉及数据库 这里使用第一种,用户将文件上,存储于:blog/public/images/文件夹下. blog/views/header.ejs  在<span><a title="发表" href=&quo

基于uploadify.js实现多文件上传和上传进度条的显示

uploadify是JQuery的一个插件,主要实现文件的异步上传功能,可以自定义文件大小限制.文件类型.是否自动上传等属性,可以显示上传的进度条.官网地址是http://www.uploadify.com/,进入官网首页(不截图了,其实也没啥看的),可以看到uploadify的标语"Upload files like magic",意思是说使用uploadify上传文件如魔法一般.目前一共分为两个版本,Flash版和HTML5版,不过HTML5版是收费的,如图: 这里我们下载Flas

js+php实现文件上传显示文件上传进度条的插件

文件上传利器SWFUpload使用指南(swfupload官网) 上传文件显示进度条效果的插件swfupload.js

AjaxUpLoad.js使用实现文件上传

AjaxUpLoad.js的使用实现无刷新文件上传,如图. 图1 文件上传前图2 文件上传后 1.创建页面并编写HTML上传文档: <div class="uploadFile"> <span id="doc"><input type="text" disabled="disabled" /></span> <input type="hidden" id