jquery动态添加删除div的例子

发布时间:2019-08-15编辑:脚本学堂
分享一个jquery动态添加删除div的实例代码,jquery动态添加删除元素的方法,jquery 在body中动态添加和删除div,需要的朋友参考下。

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>