利用JS实现页面删除并重新排序功能


Posted in Javascript onDecember 09, 2016

首先,用jqury选择器,选中勾选的行:

var cks = $("#indicator_table").find("input[type='checkbox']:checked");

然后弹出一个确认是否删除框,为是否删除框中的确定绑定一个delInd()事件;

先在页面把选中的那一行,remove或者html(“ ”)掉,

$("#indicator_table").find("input[type='checkbox']:checked").each(function(i, o){
// 获取checkbox所在行的顺序 
n = $(this).parents("tr").index();
$("#indicator_table").find("tr:eq(" + n + ")").remove();
});
$("#deleteModal").modal("hide");

在对剩下的行重新排序,又需要jqury选择器,选中表格的行,并进行循环赋值:

$("#indicator_table").find("tr").each(function(i){
$(this).find("td").eq(10).find("a").text(i+1);
});

以上所述是小编给大家介绍的利用JS实现页面删除并重新排序功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
用js实现多域名不同文件的调用方法
Jan 12 Javascript
Javascript 面向对象特性
Dec 28 Javascript
一个XML格式数据转换为图表的例子
Feb 09 Javascript
jquery根据锚点offset值实现动画切换
Sep 11 Javascript
javascript中一些util方法汇总
Jun 10 Javascript
浅谈Javascript中substr和substring的区别
Sep 30 Javascript
基于bootstrap实现收缩导航条
Mar 17 Javascript
Mongoose经常返回e11000 error的原因分析
Mar 29 Javascript
vue组件初学_弹射小球(实例讲解)
Sep 06 Javascript
Vuex 入门教程
Jan 10 Javascript
vue 使用html2canvas将DOM转化为图片的方法
Sep 11 Javascript
详解JavaScript作用域 闭包
Jul 29 Javascript
Bootstrap table使用方法详细介绍
Dec 09 #Javascript
jQuery Validate设置onkeyup验证的实例代码
Dec 09 #Javascript
任意Json转成无序列表的方法示例
Dec 09 #Javascript
利用jQuery.Validate异步验证用户名是否存在(推荐)
Dec 09 #Javascript
解析微信JS-SDK配置授权,实现分享接口
Dec 09 #Javascript
利用D3.js实现最简单的柱状图示例代码
Dec 09 #Javascript
适用于手机端的jQuery图片滑块动画
Dec 09 #Javascript
You might like
默默小谈PHP&MYSQL分页原理及实现
2007/01/02 PHP
PHP编码规范-php coding standard
2007/03/16 PHP
认识并使用PHP超级全局变量
2010/01/26 PHP
php懒人函数 自动添加数据
2011/06/28 PHP
php中的一些数组排序方法分享
2012/07/20 PHP
phpexcel导出excel的颜色和网页中的颜色显示不一致
2012/12/11 PHP
PHP判断指定时间段的2个方法
2014/03/14 PHP
php 多继承的几种常见实现方法示例
2019/11/18 PHP
JavaScript 学习小结(适合新手参考)
2009/07/30 Javascript
javascript jscroll模拟html元素滚动条
2012/12/18 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
JavaScript实现节点的删除与序号重建实例
2015/08/05 Javascript
深入理解Angular2 模板语法
2016/08/07 Javascript
BootStrap中按钮点击后被禁用按钮的最佳实现方法
2016/09/23 Javascript
Angular多选、全选、批量选择操作实例代码
2017/03/10 Javascript
jQuery Jsonp跨域模拟搜索引擎
2017/06/17 jQuery
VUE2.0+Element-UI+Echarts封装的组件实例
2018/03/02 Javascript
vue 实现v-for循环回来的数据动态绑定id
2019/11/07 Javascript
[00:20]TI9观赛名额抽取Ⅱ
2019/07/24 DOTA
简单谈谈Python中的几种常见的数据类型
2017/02/10 Python
Python3.5基础之函数的定义与使用实例详解【参数、作用域、递归、重载等】
2019/04/26 Python
python如何获取列表中每个元素的下标位置
2019/07/01 Python
使用PyTorch训练一个图像分类器实例
2020/01/08 Python
python 实时调取摄像头的示例代码
2020/11/25 Python
Python批量删除mysql中千万级大量数据的脚本分享
2020/12/03 Python
英国版MAC彩妆品牌:Illamasqua
2018/04/18 全球购物
舞会礼服和舞会鞋:PromGirl
2019/04/22 全球购物
华美博弈C/VC工程师笔试试题
2012/07/16 面试题
财务分析个人的自荐书范文
2013/11/24 职场文书
评析教师个人的自我评价
2014/02/19 职场文书
高中生操行评语
2014/04/25 职场文书
人力资源管理系自荐信
2014/05/31 职场文书
家庭教育教师培训学习体会
2016/01/14 职场文书
关于Nginx中虚拟主机的一些冷门知识小结
2022/03/03 Servers
Java9新特性之Module模块化编程示例演绎
2022/03/16 Java/Android
css中有哪些方式可以隐藏页面元素及区别
2022/06/16 HTML / CSS