利用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 相关文章推荐
从jquery的过滤器.filter()方法想到的
Sep 29 Javascript
jQuery实现向下滑出的二级菜单效果实例
Aug 22 Javascript
实例详解JSON数据格式及json格式数据域字符串相互转换
Jan 07 Javascript
获取select的value、text值的简单示例(jquery与javascript)
Dec 07 Javascript
JS经典正则表达式笔试题汇总
Dec 15 Javascript
使用vue实现点击按钮滑出面板的实现代码
Jan 10 Javascript
Vuex提升学习篇
Jan 11 Javascript
ES6 fetch函数与后台交互实现
Nov 14 Javascript
JSON是什么?有哪些优点?JSON和XML的区别?
Apr 29 Javascript
JS使用iView的Dropdown实现一个右键菜单
May 06 Javascript
vue ssr+koa2构建服务端渲染的示例代码
Mar 23 Javascript
JavaScript TAB栏切换效果的示例
Nov 05 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
玩家交还《星际争霸》原始码光盘 暴雪报以厚礼
2017/05/05 星际争霸
PHP里的中文变量说明
2011/07/23 PHP
PHP+jQuery 注册模块的改进(一):验证码存入SESSION
2014/10/14 PHP
ThinkPHP3.2.2的插件控制器功能
2015/03/05 PHP
PHP PDO和消息队列的个人理解与应用实例分析
2019/11/25 PHP
PHP执行普通shell命令流程解析
2020/08/24 PHP
jquery遍历筛选数组的几种方法和遍历解析json对象
2013/12/13 Javascript
NodeJS学习笔记之Connect中间件模块(一)
2015/01/27 NodeJs
JavaScript设计模式学习之“类式继承”
2015/03/12 Javascript
jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法
2015/11/23 Javascript
微信 jssdk 签名错误invalid signature的解决方法
2019/01/14 Javascript
es6 filter() 数组过滤方法总结
2019/04/03 Javascript
详解express使用vue-router的history踩坑
2019/06/05 Javascript
Bootstrap实现前端登录页面带验证码功能完整示例
2020/03/26 Javascript
Chrome插件开发系列一:弹窗终结者开发实战
2020/10/02 Javascript
JavaScript实现网页tab栏效果制作
2020/11/20 Javascript
[50:50]完美世界DOTA2联赛PWL S3 Galaxy Racer vs Phoenix 第一场 12.10
2020/12/13 DOTA
[01:10:24]DOTA2-DPC中国联赛 正赛 VG vs Aster BO3 第一场 2月28日
2021/03/11 DOTA
使用Python判断IP地址合法性的方法实例
2014/03/13 Python
python中requests库session对象的妙用详解
2017/10/30 Python
利用Django-environ如何区分不同环境
2018/08/26 Python
python实现蒙特卡罗方法教程
2019/01/28 Python
python logging添加filter教程
2019/12/24 Python
python游戏开发的五个案例分享
2020/03/09 Python
Python实现上下文管理器的方法
2020/08/07 Python
HTML5新增form控件和表单属性实例代码详解
2019/05/15 HTML / CSS
校园门卫岗位职责
2013/12/09 职场文书
村党支部换届选举方案
2014/05/02 职场文书
部队反四风对照检查材料
2014/09/26 职场文书
优秀护士事迹材料
2014/12/25 职场文书
班主任工作实习计划
2015/01/16 职场文书
春秋淹城导游词
2015/02/11 职场文书
努力学习保证书
2015/02/26 职场文书
Redis读写分离搭建的完整步骤
2021/09/14 Redis
Django实现WebSocket在线聊天室功能(channels库)
2021/09/25 Python
Spring Data JPA框架的核心概念和Repository接口
2022/04/28 Java/Android