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 相关文章推荐
跨浏览器通用、可重用的选项卡tab切换js代码
Sep 20 Javascript
jquery 滚动条事件简单实例
Jul 12 Javascript
javascript一元操作符(递增、递减)使用示例
Aug 07 Javascript
JavaScript判断文件上传类型的方法
Sep 02 Javascript
JavaScript获取当前网页标题(title)的方法
Apr 03 Javascript
jQuery实现文本框输入同步的方法
Jun 20 Javascript
jQuery实现的鼠标滑过弹出放大图片特效
Jan 08 Javascript
AngularJS入门教程之ng-class 指令用法
Aug 01 Javascript
判断数组的最佳方法(推荐)
Oct 11 Javascript
vue组件Prop传递数据的实现示例
Aug 17 Javascript
Js中使用正则表达式验证输入是否有特殊字符
Sep 07 Javascript
node.js中 mysql 增删改查操作及async,await处理实例分析
Feb 11 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安装threads多线程扩展基础教程
2015/11/17 PHP
会自动逐行上升的文本框
2006/06/30 Javascript
javascript陷阱 一不小心你就中招了(字符运算)
2013/11/10 Javascript
嵌入式iframe子页面与父页面js通信的方法
2015/01/20 Javascript
使用CDN和AJAX加速WordPress中jQuery的加载
2015/12/05 Javascript
js检测离开或刷新页面时表单数据是否更改的方法
2016/08/02 Javascript
详解jQuery中的DOM操作
2016/12/23 Javascript
AngularJS打开页面隐藏显示表达式用法示例
2016/12/25 Javascript
vue 将页面公用的头部组件化的方法
2017/12/18 Javascript
vue打包的时候自动将px转成rem的操作方法
2018/06/20 Javascript
js+css实现红包雨效果
2018/07/12 Javascript
angularjs的单选框+ng-repeat的实现方法
2018/09/12 Javascript
vue父组件触发事件改变子组件的值的方法实例详解
2019/05/07 Javascript
生产制造追溯系统之再说条码打印
2019/06/03 Javascript
深入解读Node.js中的koa源码
2019/06/17 Javascript
countUp.js实现数字动态变化效果
2019/10/17 Javascript
JavaScript ECMA-262-3 深入解析(二):变量对象实例详解
2020/04/25 Javascript
javascript实现贪吃蛇小游戏
2020/07/28 Javascript
Vue使用axios引起的后台session不同操作
2020/08/14 Javascript
vue+openlayers绘制省市边界线
2020/12/24 Vue.js
Python基于Socket实现的简单聊天程序示例
2017/08/05 Python
python3+dlib实现人脸识别和情绪分析
2018/04/21 Python
Python闭包执行时值的传递方式实例分析
2018/06/04 Python
完美解决在oj中Python的循环输入问题
2018/06/25 Python
python处理两种分隔符的数据集方法
2018/12/12 Python
对python打乱数据集中X,y标签对的方法详解
2018/12/14 Python
Django JWT Token RestfulAPI用户认证详解
2019/01/23 Python
python绘制双Y轴折线图以及单Y轴双变量柱状图的实例
2019/07/08 Python
Python 日志logging模块用法简单示例
2019/10/18 Python
python中的函数递归和迭代原理解析
2019/11/14 Python
numpy.transpose()实现数组的转置例子
2019/12/02 Python
详解有关PyCharm安装库失败的问题的解决方法
2020/02/02 Python
python3连接MySQL8.0的两种方式
2020/02/17 Python
描述RIP和OSPF区别以及特点
2015/01/17 面试题
运动会广播稿100字
2014/01/11 职场文书
车间班组长竞聘书
2015/09/15 职场文书