jquery动态添加删除div 具体实现

160 阅读 0 评论 106 点赞

我是靠谱客的博主糟糕电灯胆，最近开发中收集的这篇文章主要介绍jquery动态添加删除div 具体实现，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

复制代码代码如下:

<script type=”text/javascript” src=”jquery.js”></script>
<body>
<form action=”" method=”post” enctype=”multipart/form-data”>
<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>
<input type=”submit” name=”submit” value=”上传图片” />
</form>
<script type=”text/javascript” >
$(document).ready(function(){
bindListener();
});
// 用来绑定事件(使用unbind避免重复绑定)
function bindListener(){
$(“a[name=rmlink]“).unbind().click(function(){
$(this).parent().remove();
})
}
function addimg(){
$(“#mdiv”).append(‘<div class=”iptdiv”><input type=”file” name=”img[]” class=”ipt” /><a href=”#” name=”rmlink”> X </a></div>');
// 为新元素节点添加事件侦听器
bindListener();
}
</script>