JavaScript 动态删除/添加HTML表单元素_表单按钮特效

这是一个利用JavaScript动态添加/删除HTML元素的实例，这里被动态添加、删除的是表单元素，一个文件上传域，使用JS控制自动添加，你一些邮箱添加附件的功能一样，同时也可以动态删除，比较常用了。

<HTML>
<HEAD>
<title>动态添加/删除HTML元素</title>
<script   language="javascript">   
    var count= 0 ;   
    var maxfile = 5;
     增加元素
    function addUpload() {  
        if(count >= maxfile)    return;//限制最多maxfile个文件框
        count++; 
        //自增id不同的HTML对象，并附加到容器最后
        var newDiv =  "<div id=divUpload" + count +">"
            + " <input id=file" + count + " type=file size=50 name=upload>"
            + " <a href=javascript:delUpload('divUpload" + count + "');>删除</a>"
            + " </div>";   
          document.getElementById("uploadContent").insertAdjacentHTML("beforeEnd", newDiv);     
    }   
    //删除指定元素
    function delUpload(diva) {  
        count--; 
        document.getElementById(diva).parentNode.removeChild(document.getElementById(diva));   
    }   
  </script>
</HEAD>
<body   MS_POSITIONING="GridLayout">
<form   id="Form1"   method="post"   runat="server"   enctype="multipart/form-data">
  <div>
    <table>
      <tr>
        <td   id="tdRrmove"   width="2000">
        
        <div id="uploadContent">
            
        </div>
        </td>
      </tr>
    </table>
  </div>
  <a href="javascript:addUpload()">添加附件</a>
  <br/>
  <br/>
</form>
</body>
</HTML>

所属频道：表单按钮特效/更新时间：2012-12-03

[收藏][报错][返回列表]

JavaScript 动态删除/添加HTML表单元素_表单按钮特效

表单按钮特效Rss订阅特效代码搜索

表单按钮特效推荐

猜你也喜欢看这些