利用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练习之表单验证实现代码
Dec 14 Javascript
jquery焦点图片切换(数字标注/手动/自动播放/横向滚动)
Jan 24 Javascript
JS模板实现方法
Apr 03 Javascript
前台js调用后台方法示例
Dec 02 Javascript
动态JavaScript所造成一些你不知道的危害
Sep 25 Javascript
Bootstrap 网站实例之单页营销网站
Oct 20 Javascript
javascript中活灵活现的Array对象详解
Nov 30 Javascript
js canvas实现擦除效果示例代码
Apr 26 Javascript
Vue.js实现一个todo-list的上移下移删除功能
Jun 26 Javascript
详解angularjs popup-table 弹出框表格指令
Sep 20 Javascript
vue页面更新patch的实现示例
Mar 25 Javascript
js实现弹幕墙效果
Dec 10 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的header和asp中的redirect比较
2006/10/09 PHP
thinkphp路由规则使用示例详解和伪静态功能实现(apache重写)
2014/02/24 PHP
解决form中action属性后面?传递参数 获取不到的问题
2017/07/21 PHP
PHP的new static和new self的区别与使用
2019/11/27 PHP
JQuery中$之选择器用法介绍
2011/04/05 Javascript
javascript去掉前后空格的实例
2013/11/07 Javascript
jquery mobile的触控点击事件会多次触发问题的解决方法
2014/05/08 Javascript
javascript实现动态导入js与css等静态资源文件的方法
2015/07/25 Javascript
jQuery实现的仿百度分页足迹效果代码
2015/10/30 Javascript
EasyUi combotree 实现动态加载树节点
2016/04/01 Javascript
jquery显示隐藏元素的实现代码
2016/05/19 Javascript
Angularjs中$http以post请求通过消息体传递参数的实现方法
2016/08/05 Javascript
angularJs关于指令的一些冷门属性详解
2016/10/24 Javascript
详解vue嵌套路由-params传递参数
2017/05/23 Javascript
angular json对象push到数组中的方法
2018/02/27 Javascript
npm 下载指定版本的组件方法
2018/05/17 Javascript
微信小程序使用wx.request请求服务器json数据并渲染到页面操作示例
2019/03/30 Javascript
解决vue项目中出现Invalid Host header的问题
2020/11/17 Javascript
python 平衡二叉树实现代码示例
2018/07/07 Python
python 反向输出字符串的方法
2018/07/16 Python
python实现键盘控制鼠标移动
2020/11/27 Python
解决Python一行输出不显示的问题
2018/12/03 Python
Python实现正则表达式匹配任意的邮箱方法
2018/12/20 Python
Python字典的核心底层原理讲解
2019/01/24 Python
pyqt5 QProgressBar清空进度条的实例
2019/06/21 Python
CSS3.0实现霓虹灯按钮动画特效的示例代码
2021/01/12 HTML / CSS
Perfume’s Club美国官网:西班牙第一家在线美容店
2020/06/10 全球购物
武汉瑞得软件笔试题
2015/10/27 面试题
销售心得体会
2014/01/02 职场文书
大学班长的职责
2014/01/27 职场文书
2014年国培研修感言
2014/03/09 职场文书
大学生第一学年自我鉴定2015
2014/09/28 职场文书
银行自荐信范文
2015/03/25 职场文书
微信早安问候语
2015/11/10 职场文书
Redis源码阅读:Redis字符串SDS详解
2021/07/15 Redis
MyBatis自定义SQL拦截器示例详解
2021/10/24 Java/Android