【前言】
刚刚给后台加了个全选后快捷删除功能,这里用我用jquery来实现。
(1)全选和全部选
(2)获取选择的数据
(3)对数据做截取处理,然后传递后台
【主体】
用jquery处理的话,最好不要用attr方法增加属性,否则会出现第三次点击不生效的情况,用prop方法较好。用prop方法时注意jquery版本,必须是1.8之后的版本,否则不支持
<table class="table table-bordered "> <thead class="tab_head"> <tr> <td> <input type="checkbox" onclick="selectAll()"></td> <th>名称</th> <th>角明</th> <th>所统</th> </tr> </thead> <tbody> <tr> <td> <input type="checkbox"></td> <td>系管</td> <td>管角</td> <td>安台</td> </tr> <tr> <td> <input type="checkbox"></td> <td>统管</td> <td>员角</td> <td>安平</td> </tr> <tr> <td> <input type="checkbox"></td> <td>管理</td> <td>角色</td> <td>武进</td> </tr> </tbody> </table> <script> function selectAll(){ $("input[type='checkbox']").each( function() { if($(this).prop("checked")==true) { $("input[type='checkbox']").prop('checked', true); return; } else { $("input[type='checkbox']").prop('checked', false); return; } }); } </script>
以上便可以完成全选和全不选
下面获取全选的数据并进行截取处理
$('#batchDel').on('click',function(){
var idList = '';
$.each($('input:checkbox:checked'),function(){
idList+=$(this).val()+',';
});
//这里输出结果格式会是 on,aaa,bbb,ccc,
所以接下来要截取掉前后多余字符on,和,
var idListone = idList.substr(0, idList.length - 1);//删除末尾,
var idListtwo = idListone.replace("on,","");//删除首位的on,
console.log(idListtwo)
if(idListtwo == 'on'){
layer.alert('请选择要删除的文章');
}else if(idListtwo == ''){
layer.alert('请选择要删除的文章');
}else{
if(confirm('确认删除')){
window.location.href = "__MODULE__/Article/del/id/"+idListtwo;
}
}
})
补充说明:弹框用的layer进行渲染
【拓展】JS如何去除指定字符串
两种方式可以实现,这里推荐使用第一种方法
1:使用replace函数替换
var str="hello world!";
str=str.replace("l","");
即使用空串替换某一个字符串,则是可以实现去除指定字符串功能
2:使用字符串分割函数在聚合
var str="hello world!"
var items=str.split("o")
会得到一个数组,数组中包括利用o分割后的多个字符串(不包括o)
var newStr=items.join("");
会得到一个新字符串,将数组中的数组使用空串连接成一个新字符串
.
相关推荐
在Web开发中,全选删除功能是一种常见的需求,它允许用户一次性选择并删除多个条目。本教程将介绍如何使用jQuery和PHP来实现这个功能,涉及到的主要知识点包括jQuery的选择器、事件处理、AJAX通信以及PHP的数据库...
- **全选/全不选功能**: 通过`data-type="checkall"`的复选框来控制所有其他复选框的选中状态,实现全选和全不选的功能。 #### 4. jQuery操作和选择器 - **类选择器**: 使用`$('[data-type="checkbox"]')`来选取...
这个实现确保了在分页场景下,用户的多选操作(全选、反选、单选)能够正确无误地反映在表格中,并且在切换页面时,这些选择状态能够得到保留。同时,代码还处理了防止ID重复的问题,确保了数据的一致性。
然后,将原有的`hfDel`值合并到新字符串中,避免丢失之前未展示在当前页面的已选项目。 三、实现细节 1. 当用户点击全选按钮时,调用`CheckAll()`或`UnCheckAll()`函数,同时更新`hfDel`的值。 2. 当单个Checkbox...
- **实现方法**: 使用`.ToString()`方法并指定符合本地化的格式字符串。 #### 20. 表格超连接列传递参数 - **定义**: 在表格的超链接列中传递参数。 - **实现方法**: 在链接URL中包含参数。 #### 21. 清空 Cookie ...
基于ORM实现用户增加删除修改以及查看详细 Django字段类型介绍 DjangoORM字段参数介绍 DjangoORM外键操作 基于DjangoORM的外键实现增加用户(含select标签) 作业 第20周 课程安排 上课内容回顾 Django一对多的...
在本文中,我们将深入探讨如何使用jQuery来实现在两个ListBox之间互相调整子项的功能。这个功能常见于多种用户界面设计中,例如颜色选择、选项筛选等,允许用户在多个选项间进行选择和移动。 首先,我们需要理解...
- **删除功能:** 调用`del()`方法,支持全选或多选删除,树形结构类似。 - **修改功能:** 调用`edit()`方法,未选中行时提示选择,提交后更新数据。 - **添加链接:** 在特定列设置为链接,通过函数实现页面跳转。...
在ASP(Active Server Pages)开发中,批量删除多条记录是一项常见的需求,特别是在处理大量数据时,能够提高效率,减少用户等待时间。批量删除的基本思路是通过用户选择多个记录,然后通过服务器端的脚本一次性执行...
此外,还可以添加一个全选复选框,并在客户端脚本中处理其状态变化,以便自动选中所有行或取消选中所有行。 #### 6. 鼠标移到GridView某一行时改变该行的背景色 可以通过客户端脚本实现这一功能。有两种常见的实现...
通过查找二级页面的form表单(如`#selectForm`)以及其中的隐藏字段`input[name=selectData]`,可以获取到JSON格式的存储了勾选数据的字符串。然后,使用`jQuery.parseJSON`将其转换为JavaScript对象(Map),进一步...
本资料仅用于学习,请查看后24小时之内删除。 【课程内容】 第1章 01 计算机发展史 02 计算机系统 03 小结 04 数据的概念 05 进制转换 06 原码补码反码 07 物理层和数据链路层 08 网络层和arp协议 09 传输层和应用...
- 后台取值:通常通过表单提交,然后在服务器端通过相应的表单字段名称获取。 #### jQuery使用 **问题:**jQuery使用通过ID取得某元素。 **解析:**在jQuery中,可以通过 `$('#elementId')` 快速获取具有特定ID的...
对于复选框,有时候需要实现全选的功能。`checkboxs_all`函数就是用于这个目的,它会根据传入的复选框状态,改变所有同名称复选框的选中状态。 另外,特定格式的数据,比如邮政编码,也需要特定的验证。`check_...
7.[纠正]纠正部分浏览器后台列表管理的复选框全选失效的BUG 8.[纠正]纠正部分浏览器后台列表管理的多选处理按钮和下拉菜单失效的BUG 9.[改变]后台兼容模式提升到IE8模式 10.修复其他诸多小细节 2013年07月19日 V...
在ASP中,数据可以在Web页面间传递,比如通过查询字符串、隐藏字段、Session或Application对象等。 3. **Python**:Python是一种高级编程语言,广泛用于Web开发、科学计算和数据分析。其中,Django是一个流行的...