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


Posted in Javascript onJuly 20, 2013
<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>
Javascript 相关文章推荐
Javascript面向对象设计一 工厂模式
Dec 20 Javascript
js加载之使用DOM方法动态加载Javascript文件
Nov 08 Javascript
体验jQuery和AngularJS的不同点及AngularJS的迷人之处
Feb 02 Javascript
常用的js验证和数据处理总结
Aug 02 Javascript
探索Vue.js component内容实现
Nov 03 Javascript
基于JavaScript实现随机颜色输入框
Dec 10 Javascript
jQuery的$.extend 浅拷贝与深拷贝
Mar 08 Javascript
JavaScript字符串_动力节点Java学院整理
Jun 27 Javascript
Javascript中将变量转换为字符串的三种方法
Sep 19 Javascript
从零开始搭建vue移动端项目到上线的步骤
Oct 15 Javascript
js实现json数组分组合并操作示例
Feb 12 Javascript
Node.js API详解之 readline模块用法详解
May 22 Javascript
JavaScript将相对地址转换为绝对地址示例代码
Jul 19 #Javascript
鼠标焦点离开文本框时验证的js代码
Jul 19 #Javascript
jquery的flexigrid无法显示数据提示获取到数据
Jul 19 #Javascript
GridView中获取被点击行中的DropDownList和TextBox中的值
Jul 18 #Javascript
javascript判断非数字的简单例子
Jul 18 #Javascript
jquery 跳到顶部和底部动画2句代码简单实现
Jul 18 #Javascript
公共js在页面底部加载的注意事项介绍
Jul 18 #Javascript
You might like
十天学会php之第十天
2006/10/09 PHP
php curl的深入解析
2013/06/02 PHP
php统计文章排行示例
2014/03/04 PHP
php猜单词游戏
2015/09/29 PHP
浅谈PHP面向对象之访问者模式+组合模式
2017/05/22 PHP
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
2012/01/21 Javascript
window.event.keyCode兼容IE和Firefox实现js代码
2013/05/30 Javascript
jquery 取子节点及当前节点属性值
2014/07/25 Javascript
javascript实现的平方米、亩、公顷单位换算小程序
2014/08/11 Javascript
通过点击jqgrid表格弹出需要的表格数据
2015/12/02 Javascript
jquery遍历函数siblings()用法实例
2015/12/24 Javascript
Vue.JS入门教程之自定义指令
2016/12/08 Javascript
Vue.js组件通信的几种姿势
2017/10/23 Javascript
vue中el-upload上传图片到七牛的示例代码
2018/10/19 Javascript
vue 项目接口管理的实现
2019/01/17 Javascript
vue2配置scss的方法步骤
2019/06/06 Javascript
javascript面向对象三大特征之继承实例详解
2019/07/24 Javascript
Nodejs文件上传、监听上传进度的代码
2020/03/27 NodeJs
Python实现检测文件MD5值的方法示例
2018/04/11 Python
Python 爬取携程所有机票的实例代码
2018/06/11 Python
pygame游戏之旅 添加碰撞效果的方法
2018/11/20 Python
Django中多种重定向方法使用详解
2019/07/17 Python
python UDP(udp)协议发送和接收的实例
2019/07/22 Python
解决jupyter notebook 前面书写后面内容消失的问题
2020/04/13 Python
Python接口自动化测试的实现
2020/08/28 Python
python 递归相关知识总结
2021/03/03 Python
CSS3制作轮播图的一种方法
2019/11/11 HTML / CSS
美国马匹用品和马钉购物网站:State Line Tack
2018/08/05 全球购物
荷兰最大的鞋子、服装和运动折扣店:Bristol
2021/01/07 全球购物
天鹅的故事教学反思
2014/02/04 职场文书
企业年会主持词
2014/03/27 职场文书
酒店财务经理岗位职责
2015/04/08 职场文书
银行中层干部培训心得体会
2016/01/11 职场文书
初中政治教师教学反思
2016/02/23 职场文书
MySQL如何使备份得数据保持一致
2022/05/02 MySQL
5个实用的JavaScript新特性
2022/06/16 Javascript