jquery随意添加移除html的实现代码


Posted in Javascript onJune 21, 2011

html代码:

<ul id="list3" class="eventlist"> 
<li>plain</li> 
<li class="special">special <button>I am special</button></li> 
<li>plain</li> 
</ul>

script代码:
function addRemoveItemNS() { 
var $newLi = $('<li class="special">special and new <button class="addone">I am new</button> <button class="removeme">remove me</button></li>'); 
$('#list3 li.special') 
.find('button.addone') 
.unbind('click.addit') 
.bind('click.addit', function() { 
$(this).parent().after($newLi); 
addRemoveItemNS(); 
}) 
.end() 
.find('button.removeme') 
.unbind('click.removeit') 
.bind('click.removeit', function() { 
$(this).parent().remove(); 
}); 
} 
$(document).ready(function() { 
addRemoveItemNS(); 
});

可以随意添加移除html代码。
Javascript 相关文章推荐
JavaScript 的方法重载效果
Aug 07 Javascript
Jquery AJAX 用于计算点击率(统计)
Jun 30 Javascript
jquery判断字符输入个数(数字英文长度记为1,中文记为2,超过长度自动截取)
Oct 15 Javascript
javascript之典型高阶函数应用介绍二
Jan 10 Javascript
禁用键盘上的(全局)指定键兼容iE、Chrome、火狐
May 14 Javascript
将两个div左右并列显示并实现点击标题切换内容
Oct 22 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
Mar 10 Javascript
如何高效率去掉js数组中的重复项
Apr 12 Javascript
js 获取今天以及过去日期
Apr 11 Javascript
JS设计模式之单例模式(一)
Sep 29 Javascript
Vue在页面数据渲染完成之后的调用方法
Sep 11 Javascript
vue3实现v-model原理详解
Oct 09 Javascript
基于Jquery实现表格动态分页实现代码
Jun 21 #Javascript
基于jquery实现的表格分页实现代码
Jun 21 #Javascript
jquery异步请求实例代码
Jun 21 #Javascript
读jQuery之九 一些瑕疵说明
Jun 21 #Javascript
读jQuery之八 包装事件对象
Jun 21 #Javascript
读jQuery之七 判断点击了鼠标哪个键的代码
Jun 21 #Javascript
读jQuery之六 缓存数据功能介绍
Jun 21 #Javascript
You might like
php变量作用域的深入解析
2013/06/03 PHP
异步加载技术实现当滚动条到最底部的瀑布流效果
2014/09/16 PHP
如何使用纯PHP实现定时器任务(Timer)
2015/07/31 PHP
CodeIgniter 完美解决URL含有中文字符串
2016/05/13 PHP
checkbox 复选框不能为空
2009/07/11 Javascript
根据对象的某一属性进行排序的js代码(如:name,age)
2010/08/10 Javascript
基于jQuery+HttpHandler实现图片裁剪效果代码(适用于论坛, SNS)
2011/09/02 Javascript
firefox下jquery iframe刷新页面提示会导致重复之前动作
2012/12/17 Javascript
什么是 AngularJS?AngularJS简介
2014/12/06 Javascript
jquery实现很酷的网页顶部图标下拉菜单效果
2015/08/22 Javascript
基于JS实现textarea中获取动态剩余字数的方法
2016/05/25 Javascript
jQuery给div,Span, a ,button, radio 赋值与取值
2016/06/24 Javascript
jQuery插件JWPlayer视频播放器用法实例分析
2017/01/11 Javascript
jQuery自定义图片上传插件实例代码
2017/04/04 jQuery
作为老司机使用 React 总结的 11 个经验教训
2017/04/08 Javascript
基于JavaScript实现无缝滚动效果
2017/07/21 Javascript
swiper 自动图片无限轮播实现代码
2018/05/21 Javascript
vue基于element-ui的三级CheckBox复选框功能的实现代码
2018/10/15 Javascript
Angular(5.2-&gt;6.1)升级小结
2018/12/27 Javascript
laypage+SpringMVC实现后端分页
2019/07/27 Javascript
微信小程序如何实现点击图片放大功能
2020/01/21 Javascript
python使用WMI检测windows系统信息、硬盘信息、网卡信息的方法
2015/05/15 Python
Python实现将绝对URL替换成相对URL的方法
2015/06/28 Python
基于Django contrib Comments 评论模块(详解)
2017/12/08 Python
提升Python程序性能的7个习惯
2019/04/14 Python
Python实现FM算法解析
2019/06/18 Python
python利用tkinter实现屏保
2019/07/30 Python
Python求正态分布曲线下面积实例
2019/11/20 Python
Python实现获取当前目录下文件名代码详解
2020/03/10 Python
美国智能家居专家:tink
2019/06/04 全球购物
大学生毕业求职自荐书范文
2014/02/04 职场文书
消防安全宣传口号
2014/06/10 职场文书
2015年五四青年节演讲稿
2015/03/18 职场文书
爱国主题班会教案
2015/08/14 职场文书
幼儿园小班教育随笔
2015/08/14 职场文书
Nginx禁止ip访问或非法域名访问
2022/04/07 Servers