利用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 相关文章推荐
IE不出现Flash激活框的小发现的js实现方法
Sep 07 Javascript
javascript与CSS复习(二)
Jun 29 Javascript
使用JavaScript检测Firefox浏览器是否启用了Firebug的代码
Dec 28 Javascript
js 限制数字 js限制输入实现代码
Dec 04 Javascript
JavaScript:Div层拖动效果实例代码
Aug 06 Javascript
JavaScript中“过于”犀利地for/in循环使用示例
Oct 22 Javascript
JavaScript DOM 对象深入了解
Jul 20 Javascript
微信小程序开发探究
Dec 27 Javascript
angularjs select 赋值 ng-options配置方法
Feb 28 Javascript
vue实现双向绑定和依赖收集遇到的坑
Nov 29 Javascript
基于vue.js组件实现分页效果
Dec 29 Javascript
原生js实现日期选择插件
May 21 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
大家未必知道的Js技巧收藏
2008/04/07 Javascript
理解Javascript_05_原型继承原理
2010/10/13 Javascript
javascript设计模式 接口介绍
2012/07/24 Javascript
javascript将浮点数转换成整数的三个方法
2014/06/23 Javascript
Javascript中拼接大量字符串的方法
2015/02/05 Javascript
jQuery仿360导航页图标拖动排序效果代码分享
2015/08/24 Javascript
Wireshark基本介绍和学习TCP三次握手
2016/08/15 Javascript
AngularJS入门教程之迭代器过滤详解
2016/08/18 Javascript
微信小程序 教程之数据绑定
2016/10/18 Javascript
js图片放大镜实例讲解(必看篇)
2017/07/17 Javascript
vue router使用query和params传参的使用和区别
2017/11/13 Javascript
纯异步nodejs文件夹(目录)复制功能
2019/09/03 NodeJs
小程序实现日历左右滑动效果
2019/10/21 Javascript
Vue实现push数组并删除的例子
2019/11/01 Javascript
jQuery实现颜色打字机的完整代码
2020/03/19 jQuery
[02:28]DOTA2英雄基础教程 灰烬之灵
2013/12/19 DOTA
[01:14]DOTA2 7.22版本新增神杖效果展示(智力英雄篇)
2019/05/29 DOTA
Python制作爬虫采集小说
2015/10/25 Python
Python 'takes exactly 1 argument (2 given)' Python error
2016/12/13 Python
python中异常捕获方法详解
2017/03/03 Python
Pycharm学习教程(2) 代码风格
2017/05/02 Python
Python入门_浅谈数据结构的4种基本类型
2017/05/16 Python
完美解决Pycharm无法导入包的问题 Unresolved reference
2018/05/18 Python
pandas求两个表格不相交的集合方法
2018/12/08 Python
Django REST framework 视图和路由详解
2019/07/19 Python
python中bs4.BeautifulSoup的基本用法
2019/07/27 Python
利用python实现周期财务统计可视化
2019/08/25 Python
运行Python编写的程序方法实例
2020/10/21 Python
python线程优先级队列知识点总结
2021/02/28 Python
CSS3中的display:grid,网格布局介绍
2019/10/30 HTML / CSS
C语言编程题
2015/03/09 面试题
Java中的类包括什么内容?设计时要注意哪些方面
2012/05/23 面试题
同步和异步有何异同,在什么情况下分别使用他们
2013/04/09 面试题
工作中的自我评价如何写好
2013/10/28 职场文书
大学生简历的个人自我评价
2013/12/04 职场文书
单位综合评价意见
2015/06/05 职场文书