jquery动态添加和删除<input type="file" />
本章节分享一段代码实例，它实现了动态添加或者删除<input type="file" />标签的功能。
在很多时候，上传的文件可能根据实际情况来决定，所以动态的添加或者删除此控件还是很有必要的。
代码实例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.pipipi.net/" />
<title>前端教程网</title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(":input[type=button][value=more]").bind("click",function(){
var $br = $("<br />");
var $file = $("<input type='file' name='name1' />");
var $button = $("<input type='button' value='delete'>");
$(this).after($file).after($button).after($br);
$button.bind("click",function(){
$br.remove();
$file.remove();
$button.remove();
})
})
});
</script>
</head>
<body>
<input type="file" name="file1"/>
<input type="button" value="more"/>
</body>
</html>
上面的代码实现了我们的要求，下面介绍一下它的实现过程。
一.代码实例:
（1）.$(document).ready(function(){})，当文档结构完全加载完毕再去执行函数中的代码。
（2）.$(":input[type=button][value=more]").bind("click",function(){})，为type属性值为button和value等于more的input元素注册click事件处理函数。（3）.var $br = $("<br />")，创建一个<br>元素对象。
（4）.var $file = $("<input type='file' name='name1' />")，创建一个上传控件。
（5）.var $button = $("<input type='button' value='delete'>")，创建一个删除按钮。
（6）.$(this).after($file).after($button).after($br)，在more按钮后面以此插入上述创建的元素。
（7）.$button.bind("click",function(){
$br.remove();
$file.remove();
$button.remove();
}),删除指定的元素。
二.相关阅读:
（1）.[type=button][value=more]可以参阅jQuery [attribute=value]一章节。
（2）.after()可以参阅jQuery after()一章节。
（3）.remove()可以参阅jQuery remove()一章节。
jquery动态添加和删除<input type="file" />，这样的场景在实际项目中还是用的比较多的，关于jquery动态添加和删除<input type="file" />就介绍到这了。
jquery动态添加和删除<input type="file" />属于前端实例代码，有关更多实例代码大家可以查看。