利用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打印纸函数代码(递归)
Jun 18 Javascript
UpdatePanel和Jquery冲突的解决方法
Apr 01 Javascript
jquery mobile的触控点击事件会多次触发问题的解决方法
May 08 Javascript
用原生JS获取CLASS对象(很简单实用)
Oct 15 Javascript
angularJS结合canvas画图例子
Feb 09 Javascript
详解 javascript中offsetleft属性的用法
Nov 11 Javascript
Three.js学习之正交投影照相机
Aug 01 Javascript
JS实现加载和读取XML文件的方法详解
Apr 24 Javascript
Angular.js指令学习中一些重要属性的用法教程
May 24 Javascript
jQuery操作DOM_动力节点Java学院整理
Jul 04 jQuery
利用Three.js如何实现阴影效果实例代码
Sep 26 Javascript
Vue vm.$attrs使用场景详解
Mar 08 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
discuz程序的PHP加密函数原理分析
2011/08/05 PHP
php实现在新浪云中使用imagick生成缩略图并上传的方法
2016/09/26 PHP
php+redis实现多台服务器内网存储session并读取示例
2017/01/12 PHP
PHP yield关键字功能与用法分析
2019/01/03 PHP
使用laravel的migrate创建数据表的方法
2019/09/30 PHP
JavaScript中json使用自己总结
2013/08/13 Javascript
深入理解Javascript中的循环优化
2013/11/09 Javascript
javascript静态页面传值的三种方法分享
2013/11/12 Javascript
jquery仿百度百科底部浮动导航特效
2015/08/08 Javascript
在Docker快速部署Node.js应用的详细步骤
2016/09/02 Javascript
jQuery+正则+文本框只能输入数字的实现方法
2016/10/07 Javascript
使用travis-ci如何持续部署node.js应用详解
2017/07/30 Javascript
node中的密码安全(加密)
2018/09/17 Javascript
vue中使用better-scroll实现滑动效果及注意事项
2018/11/15 Javascript
浅析vue插槽和作用域插槽的理解
2019/04/22 Javascript
jquery实现垂直无限轮播的方法分析
2019/07/16 jQuery
vue配置nprogress实现页面顶部进度条
2019/09/21 Javascript
vue 使用 canvas 实现手写电子签名
2020/03/06 Javascript
python通过pil将图片转换成黑白效果的方法
2015/03/16 Python
深入理解python函数递归和生成器
2016/06/06 Python
OpenCV+python手势识别框架和实例讲解
2018/08/03 Python
python实现剪切功能
2019/01/23 Python
Python下简易的单例模式详解
2019/04/08 Python
Python中zip()函数的解释和可视化(实例详解)
2020/02/16 Python
Python爬虫headers处理及网络超时问题解决方案
2020/06/19 Python
python 利用matplotlib在3D空间绘制二次抛物面的案例
2021/02/06 Python
CSS3弹性盒模型开发笔记(一)
2016/04/26 HTML / CSS
推荐10个CSS3 制作的创意下拉菜单效果
2014/02/11 HTML / CSS
马克华菲官方商城:Mark Fairwhale
2016/09/04 全球购物
印尼第一大家居、生活和家具电子商务:Ruparupa
2019/11/25 全球购物
小区消防演习方案
2014/02/21 职场文书
2014年医德医风工作总结
2014/11/13 职场文书
大学生个人学年总结
2015/02/15 职场文书
活动新闻稿范文
2015/07/17 职场文书
德能勤绩工作总结
2015/08/11 职场文书
音乐研修感悟
2015/11/18 职场文书