利用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 1.4 15个你应该知道的新特性(译)
Jan 24 Javascript
jQuery ajax BUG:object doesn't support this property or method
Jul 06 Javascript
一个简单的Ext.XTemplate的实例代码
Mar 18 Javascript
js动态添加事件并可传参数示例代码
Oct 21 Javascript
JQuery判断checkbox是否选中及其它复选框操作方法合集
Jun 01 Javascript
jquery+ajax实现直接提交表单实例分析
Jun 17 Javascript
值得分享的JavaScript实现图片轮播组件
Nov 21 Javascript
JS设置手机验证码60s等待实现代码
Jun 14 Javascript
Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
Aug 22 Javascript
微信小程序实战篇之购物车的实现代码示例
Nov 30 Javascript
angularjs中判断ng-repeat是否迭代完的实例
Sep 12 Javascript
解决VUE双向绑定失效的问题
Oct 29 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
DOTA2 1月28日更新:监管系统降临刀塔世界
2021/01/28 DOTA
javascript 定义初始化数组函数
2009/09/07 Javascript
jQuery 常见操作实现方式和常用函数方法总结
2011/05/06 Javascript
JS实现静止元素自动移动示例
2014/04/14 Javascript
js下将阿拉伯数字每三位一逗号分隔(如:15000000转化为15,000,000)
2014/06/02 Javascript
Bootstrap每天必学之栅格系统(布局)
2015/11/25 Javascript
JavaScript编写的网页小游戏,很给力
2017/08/18 Javascript
微信小程序网络封装(简单高效)
2018/08/06 Javascript
vue-cli项目修改文件热重载失效的解决方法
2018/09/19 Javascript
Vue-CLI3.x 设置反向代理的方法
2018/12/06 Javascript
vue中的mvvm模式讲解
2019/01/31 Javascript
vue.js基于v-for实现批量渲染 Json数组对象列表数据示例
2019/08/03 Javascript
layui按条件隐藏表格列的实例
2019/09/19 Javascript
python修改注册表终止360进程实例
2014/10/13 Python
Python实现获取某天是某个月中的第几周
2015/02/11 Python
以一段代码为实例快速入门Python2.7
2015/03/31 Python
jupyter notebook引用from pyecharts.charts import Bar运行报错
2020/04/23 Python
使用Python 统计高频字数的方法
2019/01/31 Python
Python list列表中删除多个重复元素操作示例
2019/02/27 Python
使用Python求解带约束的最优化问题详解
2020/02/11 Python
Python API len函数操作过程解析
2020/03/05 Python
利用 PyCharm 实现本地代码和远端的实时同步功能
2020/03/23 Python
Jupyter notebook无法导入第三方模块的解决方式
2020/04/15 Python
PHP基于phpqrcode类库生成二维码过程解析
2020/05/28 Python
详解Java中一维、二维数组在内存中的结构
2021/02/11 Python
巧用CSS3的calc()宽度计算做响应模式布局的方法
2018/03/22 HTML / CSS
大学生毕业自我评价范文分享
2013/11/11 职场文书
创先争优活动方案
2014/02/12 职场文书
高中毕业生的个人自我评价
2014/02/21 职场文书
办公室主任职责范本
2014/03/07 职场文书
小学生运动会报道稿
2014/09/12 职场文书
2014卖家双十一活动策划书
2014/09/29 职场文书
万能检讨书
2015/01/27 职场文书
董事会决议范本
2015/07/01 职场文书
详解Redis实现限流的三种方式
2021/04/27 Redis
Java中生成微信小程序太阳码的实现方案
2022/06/01 Java/Android