点击按钮添加<input type="file" />代码实例:
在不少网站都与这样的功能，那就是可以根据用户的需要自行添加<input type="file" />，如果感觉不需要还可以再删除，这样可以极大的提高网站的可用性，当然用户也会更加的青睐。
代码如下:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>增加input元素-蚂蚁部落</title><script type="text/javascript" src='/images/loading.gif' data-original="http://www.softwhy.com/mytest/jQuery/jquery-1.8.3.js"></script><script type="text/javascript" > $(document).ready(function(){ bindListener();});function bindListener(){ $("a[name=rmlink]").click(function(){ $(this).parent().remove(); })}function addimg(){ var inputStr="<div class='iptdiv'>" inputStr=inputStr+"<input type='file' name='img[]' class='ipt' />" inputStr=inputStr+"<a href='#' name='rmlink'> X </a></div>"; $("#mdiv").append(inputStr); bindListener();} </script></head><body> <form action="" method="post"> <label>请选择上传的图片</label> <a href="javascript:addimg()" >增加图片</a> <div class="mdiv" id="mdiv"> <div class="iptdiv" > <input type="file" name="img[]" class="ipt" /> <a href="#" name="rmlink">X</a> </div> </div> </form> </body></html>
上面代码点击按钮可以添加一项input元素，并且点击后面的x号可以删除当前航按钮，下面就简单介绍一下实现过程。
一.实现原理:
原理很简单，就是每次点击"增加图片"链接，都可以使用append()函数添加一个div，此div中包含input元素和后面的删除链接。当点击删除链接的时候可以使用parent()函数找到当前input元素所在的div元素，然后使用remove()函数进行删除操作。
三.代码注释:
1.$(document).ready(function(){})，当文档结构完全加载完成再去执行其中的代码。
2.bindListener()，执行此函数，在下面会有对此函数的介绍。
3.function bindListener(){}，为name属性值为rmlink的链接注册事件处理函数，用来删除添加的元素。
4.$("a[name=rmlink]").click(function(){}），为name属性值为rmlink的链接注册click事件处理函数。
5.$(this).parent().remove()，删除当前元素的父元素。
6.function addimg(){}，创建一个函数用来添加input元素。
7.var inputStr="<div class='iptdiv'>"，字符串是被用来添加的input等元素。
8.$("#mdiv").append(inputStr)，为id为mydiv元素的内部结尾添加inputStr，也就是input等元素。
9.bindListener(),调用此函数。
三.相关阅读:
1.注册click事件处理函数可以参阅jQuery的click事件一章节。
2.parent()函数可以参阅jQuery的parent()和parents()方法的用法和区别一章节。
3.remove()函数可以参阅jQuery的remove()方法一章节。
4.append()函数可以参阅jQuery的append()方法一章节。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=8674
更多内容可以参阅:http://www.softwhy.com/jquery/
原标题：点击按钮添加input type=file /代码实例
关键词：
我知道了 