JavaScript设置表单上传时文件个数的方法
更新时间:2015年08月11日 12:44:52 作者:皮蛋
这篇文章主要介绍了JavaScript设置表单上传时文件个数的方法,可实现动态增加及删除表单上传按钮的功能,非常简单实用,需要的朋友可以参考下
本文实例讲述了JavaScript设置表单上传时文件个数的方法。分享给大家供大家参考。具体如下:
这是一个比较实用的功能,用JavaScript来设置表单上传文件时,根据需要生成上传表单,要几个生成几个,在网易邮箱、新浪邮箱的添加附件功能里都有这种功能,不过这一款没有删除表单的功能,如果输入的多了,只好重新来过啦
运行效果如下图所示:

具体代码如下:
<title>JavaScript设置表单上传时的文件个数</title>
<input type="button" name="button" value="添加附件" onclick="addInput()">
<input type="button" name="button" value="删除附件" onclick="deleteInput()">
<span id="upload"></span>
<script type="text/javascript">
var attachname = "attach";
var i=1;
function addInput(){
if(i>0){
var attach = attachname + i ;
if(createInput(attach))
i=i+1;
}
}
function deleteInput(){
if(i>1){
i=i-1;
if(!removeInput())
i=i+1;
}
}
function createInput(nm){
var aElement=document.createElement("input");
aElement.name=nm;
aElement.id=nm;
aElement.type="file";
aElement.size="50";
//aElement.value="thanks";
//aElement.onclick=Function("asdf()");
if(document.getElementById("upload").appendChild(aElement) == null)
return false;
return true;
}
function removeInput(nm){
var aElement = document.getElementById("upload");
if(aElement.removeChild(aElement.lastChild) == null)
return false;
return true;
}
</script>
希望本文所述对大家的javascript程序设计有所帮助。
相关文章
js中的document.querySelector()方法举例详解
这篇文章主要给大家介绍了关于js中document.querySelector()方法的相关资料,document.querySelector是JavaScript中的一个内置方法,用于通过CSS选择器选择文档中的第一个匹配元素,需要的朋友可以参考下2024-01-01
JavaScript装箱及拆箱boxing及unBoxing用法解析
这篇文章主要介绍了JavaScript装箱及拆箱boxing及unBoxing用法解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-06-06
webpack中CommonsChunkPlugin详细教程(小结)
本篇文章主要介绍了webpack中CommonsChunkPlugin详细教程(小结),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧2017-11-11
javascript之DIV拖动类 支持在FF下拖动,调用简单
javascript之DIV拖动类 支持在FF下拖动,调用简单...2007-08-08


最新评论