jQuery动态添加、删除元素的方法


Posted in Javascript onJanuary 09, 2014
<script> 
$.schoolFn = { 
addItem: function(obj){ 
$("#itemList").append("<li id='liItrm' class='list-group-item clearfix'><span class='glyphicon glyphicon-resize-vertical sort-handle'></span>"+obj+"<input type='hidden' name='audiences' value='"+obj+"'><button type='button' class='close delete-btn deleteItem' onclick='deleteItem(this);' title='删除'>×</button></li>"); 
}, removeItem: function(obj){ 
$("#"+obj).replaceWith(""); 
} 
} 
$("#itemAdd").click(function(){ 
var item=$('#teacherInput').val(); 
$.schoolFn.addItem(item); 
$('#teacherInput').val(""); 
}); 
function deleteItem(obj){ 
var item=$(obj).parents(".list-group-item").attr("id"); 
$.schoolFn.removeItem(item); 
} 
</script>
Javascript 相关文章推荐
JS对select控件option选项的增删改查示例代码
Oct 21 Javascript
基于jquery实现等比缩放图片
Dec 03 Javascript
每天一篇javascript学习小结(Function对象)
Nov 16 Javascript
基于JavaScript实现动态创建表格和增加表格行数
Dec 20 Javascript
jquery.cookie实现的客户端购物车操作实例
Dec 24 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
Nov 02 Javascript
JavaScript用200行代码制作打飞机小游戏实例
Jun 21 Javascript
超级简易的JS计算器实例讲解(实现加减乘除)
Aug 08 Javascript
通过示例彻底搞懂js闭包
Aug 10 Javascript
JS求Number类型数组中最大元素方法
Apr 08 Javascript
vue-router 路由传参用法实例分析
Mar 06 Javascript
Vue中正确使用Element-UI组件的方法实例
Oct 13 Javascript
jquery实现鼠标拖动图片效果示例代码
Jan 09 #Javascript
二叉树先序遍历的非递归算法具体实现
Jan 09 #Javascript
IE下Ajax缓存问题的快速解决方法(get方式)
Jan 09 #Javascript
js/jquery解析json和数组格式的方法详解
Jan 09 #Javascript
JS获取节点的兄弟,父级,子级元素的方法
Jan 09 #Javascript
js与jquery获取父级元素,子级元素,兄弟元素的实现方法
Jan 09 #Javascript
js与jquery获取父元素,删除子元素的两种不同方法
Jan 09 #Javascript
You might like
php str_replace的替换漏洞
2008/03/15 PHP
php连接odbc数据源并保存与查询数据的方法
2014/12/24 PHP
PHP实现生成带背景的图形验证码功能
2016/10/03 PHP
js获取单选按钮的数据
2006/11/27 Javascript
JS中confirm,alert,prompt函数区别分析
2011/01/17 Javascript
jQuery实现倒计时按钮功能代码分享
2014/09/03 Javascript
DOM节点深度克隆函数cloneNode()用法实例
2015/01/12 Javascript
使用Jquery实现每日签到功能
2015/04/03 Javascript
javascript实现列表滚动的方法
2015/07/30 Javascript
jQuery网页右侧广告跟随滚动代码分享
2020/04/20 Javascript
js实现简单的验证码
2015/12/25 Javascript
JavaScript中的Reflect对象详解(ES6新特性)
2016/07/22 Javascript
jquery删除table当前行的实例代码
2016/10/07 Javascript
Vue过滤器的用法和自定义过滤器使用
2017/02/08 Javascript
bootstrap fileinput 上传插件的基础使用
2017/02/17 Javascript
Vue2.0实现购物车功能
2017/06/05 Javascript
JS实现简单的浮动碰撞效果示例
2017/12/28 Javascript
vue轮播图插件vue-concise-slider的使用
2018/03/13 Javascript
Koa日志中间件封装开发详解
2019/03/09 Javascript
详解小程序如何改变onLoad的执行时机
2019/11/01 Javascript
vue3.0实现点击切换验证码(组件)及校验
2020/11/18 Vue.js
[02:19]DOTA2上海特级锦标赛 观赛指南 Spectator Guide
2016/02/04 DOTA
Python中实现的RC4算法
2015/02/14 Python
探索Python3.4中新引入的asyncio模块
2015/04/08 Python
目前最全的python的就业方向
2018/06/05 Python
django框架之cookie/session的使用示例(小结)
2018/10/15 Python
Python+OpenCV实现图像融合的原理及代码
2018/12/03 Python
Python绘制并保存指定大小图像的方法
2019/01/10 Python
python 实现目录复制的三种小结
2019/12/04 Python
python读取hdfs上的parquet文件方式
2020/06/06 Python
Python -m参数原理及使用方法解析
2020/08/21 Python
python math模块的基本使用教程
2021/01/16 Python
英国天然有机美容护肤品:Neal’s Yard Remedies
2018/05/05 全球购物
编辑个人求职信范文
2013/09/21 职场文书
困难补助申请报告
2015/05/19 职场文书
法人身份证明书
2015/06/18 职场文书