利用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 17 Javascript
JS打开层/关闭层/移动层动画效果的实例代码
May 11 Javascript
判断JS对象是否拥有某种属性的两种方式
Dec 02 Javascript
浅谈Sticky组件的改进实现
Mar 22 Javascript
BootStrap制作导航条实例代码
May 06 Javascript
原生JS实现层叠轮播图
May 17 Javascript
bootstrap多层模态框滚动条消失的问题
Jul 21 Javascript
对于input 框限定输入值为浮点型的js代码
Sep 25 Javascript
Vue精简版风格指南(推荐)
Jan 30 Javascript
详解Node.js 中使用 ECDSA 签名遇到的坑
Nov 26 Javascript
js中apply和call的理解与使用方法
Nov 27 Javascript
js+css实现全屏侧边栏
Jun 16 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
浅谈电磁辐射对健康的影响
2021/03/01 无线电
openflashchart 2.0 简单案例php版
2012/05/21 PHP
Yii2.0使用阿里云OSS的SDK上传图片、下载、删除图片示例
2017/09/20 PHP
Laravel6.2中用于用户登录的新密码确认流程详解
2019/10/16 PHP
js 纯数字不重复排列的另类方法
2010/07/17 Javascript
实例说明为什么不要行内使用javascript
2014/04/18 Javascript
jQuery实现可以编辑的表格实例详解【附demo源码下载】
2016/07/09 Javascript
使用bat打开多个cmd窗口执行gulp、node
2017/02/17 Javascript
使用 NodeJS+Express 开发服务端的简单介绍
2017/04/07 NodeJs
jQuery动态添加元素无法触发绑定事件的解决方法分析
2018/01/02 jQuery
JavaScript累加、迭代、穷举、递归等常用算法实例小结
2018/05/08 Javascript
微信小程序中的店铺评分组件及vue中用svg实现的评分显示组件
2018/11/16 Javascript
vue弹出框组件封装实例代码
2019/10/31 Javascript
vue实现短信验证码登录功能(流程详解)
2019/12/10 Javascript
js Math数学简单使用操作示例
2020/03/13 Javascript
[06:25]DOTA2英雄梦之声_第17期_大地之灵
2014/06/20 DOTA
Python tkinter模块中类继承的三种方式分析
2017/08/08 Python
Python带动态参数功能的sqlite工具类
2018/05/26 Python
使用python实现快速搭建简易的FTP服务器
2018/09/12 Python
利用Pyhton中的requests包进行网页访问测试的方法
2018/12/26 Python
Python使用paramiko操作linux的方法讲解
2019/02/25 Python
Pycharm运行加载文本出现错误的解决方法
2019/06/27 Python
基于django传递数据到后端的例子
2019/08/16 Python
15行Python代码实现免费发送手机短信推送消息功能
2020/02/27 Python
tensorflow/core/platform/cpu_feature_guard.cc:140] Your CPU supports instructions that this T
2020/06/22 Python
夏威夷航空官网:Hawaiian Airlines
2016/09/11 全球购物
BIBLOO捷克:购买女装、男装、童装、鞋和配件
2017/01/27 全球购物
Ruby如何定义一个类
2012/10/08 面试题
预备党员党课思想汇报
2014/01/13 职场文书
条幅标语大全
2014/06/20 职场文书
工作失职自我检讨书
2015/05/05 职场文书
初婚初育证明范本
2015/06/18 职场文书
Canvas跟随鼠标炫彩小球的实现
2021/04/11 Javascript
python opencv检测直线 cv2.HoughLinesP的实现
2021/06/18 Python
基于docker安装zabbix的详细教程
2022/06/05 Servers
Java实现简单小画板
2022/06/10 Java/Android