利用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 相关文章推荐
ExtJS Store的数据访问与更新问题
Apr 28 Javascript
jquery乱码与contentType属性设置问题解决方案
Jan 07 Javascript
artdialog的图片/标题以及关闭按钮不显示的解决方法
Jun 27 Javascript
JavaScript Array对象扩展indexOf()方法
May 09 Javascript
浅谈javascript中的闭包
May 13 Javascript
Angular的Bootstrap(引导)和Compiler(编译)机制
Jun 20 Javascript
jQuery+CSS实现的table表格行列转置功能示例
Jan 08 jQuery
vue-cli3.0 特性解读
Apr 22 Javascript
vue 基于element-ui 分页组件封装的实例代码
Dec 10 Javascript
vue组件化中slot的基本使用方法
May 01 Javascript
微信小游戏之使用three.js 绘制一个旋转的三角形
Jun 10 Javascript
JavaScript字符和ASCII实现互相转换
Jun 03 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编码规范-php coding standard
2007/03/16 PHP
利用PHP生成静态HTML文档的原理
2012/10/29 PHP
Windows下的PHP安装文件线程安全和非线程安全的区别
2014/04/23 PHP
php数组添加与删除单元的常用函数实例分析
2015/02/16 PHP
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
Jquery ajax执行顺序 返回自定义错误信息(实例讲解)
2013/11/06 Javascript
jQuery 追加元素的方法如append、prepend、before
2014/01/16 Javascript
JS扩展方法实例分析
2015/04/15 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
2015/06/10 Javascript
jQuery仅用3行代码实现的显示与隐藏功能完整实例
2015/10/08 Javascript
基于javascript简单实现对身份证校验
2021/01/25 Javascript
jQuery实现下拉菜单(内容为时间)的实时更新及图表的随动更新的方法
2016/07/07 Javascript
JS快速实现移动端拼图游戏
2016/09/05 Javascript
BootStrap实现鼠标悬停下拉列表功能
2017/02/17 Javascript
原生js封装自定义滚动条
2017/03/24 Javascript
Agularjs妙用双向数据绑定实现手风琴效果
2017/05/26 Javascript
JS原生轮播图的简单实现(推荐)
2017/07/22 Javascript
Element-UI中关于table表格的那些骚操作(小结)
2019/08/15 Javascript
package.json各个属性说明详解
2020/03/11 Javascript
浅谈python 里面的单下划线与双下划线的区别
2017/12/01 Python
Python3.5文件修改操作实例分析
2019/05/01 Python
python编程进阶之类和对象用法实例分析
2020/02/21 Python
django admin 添加自定义链接方式
2020/03/11 Python
python图片指定区域替换img.paste函数的使用
2020/04/09 Python
python speech模块的使用方法
2020/09/09 Python
详解基于Facecognition+Opencv快速搭建人脸识别及跟踪应用
2021/01/21 Python
Css3圆角边框制作代码
2015/11/18 HTML / CSS
使用css创建三角形 使用CSS3创建3d四面体原理及代码(html5实践)
2013/01/06 HTML / CSS
Html5移动端适配IphoneX等机型的方法
2019/06/25 HTML / CSS
国际化的太阳镜及太阳镜配件零售商:Sunglass Hut
2016/07/26 全球购物
巴西最大的家具及装饰用品店:Mobly
2017/10/11 全球购物
int和Integer有什么区别
2013/05/25 面试题
2014应届本科生自我评价
2014/09/13 职场文书
医学专业大学生职业生涯规划书
2014/10/25 职场文书
文书工作总结(范文)
2019/07/11 职场文书
python学习之panda数据分析核心支持库
2021/05/07 Python