复选框 遍历选中 php,jQuery的复选框选择并且获取值
这次给大家带来jQuery的复选框选择并且获取值,jQuery复选框选择并且获取值的注意事项有哪些,下面就是实战案例,一起来看一下。
一、checkbox选择
在jQuery中,选中checkbox通用的两种方式:$("#cb1").attr("checked","checked");
$("#cb1").attr("checked",true);
对应的jQuery函数,主要完成三个功能:
1、第一个复选框选中或取消选中,则下面的复选框为全选或取消全选;
2、当下面的复选框全部选中时,则将第一个复选框设置为选中,当下面的复选框中有一个没有被选中时,则第一个复选框取消选中;
3、将下面的复选框的id值传递给Controller层,组成id数组,然后调用相应的方法(一般都是删除)。
$("input[name='id']").attr('checked',t.checked);//改变name名为id的input标签内的复选框的checked属性
}
function chg(){//当下面的复选框全部选中时,则将第一个复选框设置为选中,当下面的复选框中有一个没有被选中时,则第一个复选框取消选中;
var ids = $.makeArray($("input[name='id']"));
for(var i in ids){
if(ids[i].checked==false){//如果所有的复选框只要有一个未选中,则第一个复选框不会选中
$("input[name='ids']").attr('checked', false);
return;
}
}
$("input[name='ids']").attr('checked', true);//全部选中的情况下,则第一个复选框选中
}
function deleteBatch(){//将下面的复选框的id值传递给Controller层,组成id数组,拼接url到controller层,调用批量删除方法(deleteBatch())方法
var ids = $.makeArray($("input[name='id']:checked"));//通过$.makeArray将id放在数组中
var url = '<%basePath%>/web/goodsList/deleteBatch';//此url指向controller层的deleteBatch方法,需要id属性
var flag = true;
for(var i in ids){//遍历数组
if(i == 0){
url += "?id=" + ids[i].value;//第一个id属性前加?拼接
flag = false;
} else {
url += "&id=" + ids[i].value;//后面的id属性前加&拼接
flag = false;
}
}
if(flag){//如果没有选中商品
alert("请选中商品!");
return;
}
if(confirm("确定删除记录吗?")){
window.location.href = url;//把拼接好的id数组传给页面
}
}
二、在jsp页面中对应的列表:
1、列表中要给表头中的复选框(第一个复选框)设置name名,并调用chgAll(this)方法来实现全选或全不选;
2、table中的复选框设置name名,并调用chg()方法来实现上面的第二个功能;
3、form表单提交时调用deleteBatch()方法
//form表单提交时调用deleteBatch()方法
//调用chgAll(this)方法来实现全选或全不选,此处的this指所有复选框对象商品编号商品标题
//调用chg()方法${webGoodsInfo.goodsNo}${webGoodsInfo.goodsTitle}
三、看下spring MCV中的controller代码@RequestMapping("deleteBatch")//对应jsp页面中的deleteBatch()请求
public String deleteBatch(Long[] id, RedirectAttributes redirectAttributes){//此处的id为页面中的id值,必须保持一直!!!!
if(id !=null&&id.length!=0){
goodsService.deleteBatch(id);
}
return "redirect:"+Global.getAdminPath()+"/web/webGoodsInfo/?repage";//重定向到列表页面
}
}
看下效果:
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
复选框 遍历选中 php,jQuery的复选框选择并且获取值相关推荐
- ajax onclick() 获取最新输入的文本框的值,如何从jQuery onclick函数的Ajax函数中获取值?...
我有一个按钮,当我点击它时,它会从我的数据库中获取数据,并根据ID将其显示在我的文本区域中.如何从jQuery onclick函数的Ajax函数中获取值? JQuery的 $('#verifyBtn' ...
- html单选框选中状态,jquery怎么判断单选框是否选中
jquery判断单选框是否选中的方法:1.通过单选框选中的值判断.2.通过单选框的checked属性判断是否选中. jquery判断单选框是否选中的两种方法介绍: 第一种:利用选中值判断选中/p> ...
- html单选框选中状态,jquery如何判断单选框是否被选中?
jquery如何判断单选框是否被选中?下面本篇文章就来给大家介绍一下Jquery判断单选框是否选中和获取选中值的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 方法1:利用选中 ...
- java在线选座功能_基于jquery实现在线选座订座之影院篇
先给大家展示效果图(支持源码下载哦): 我们在线购票时(如电影票.车票等)可以自己选座.开发者会在页面上列出座次席位,用户可以一目了然的看到可以选择的座位及支付.本文以电影院购票为例,为您展示如何选座 ...
- html+复选框不选中事件,html – CSS复选框事件不起作用
您没有使用正确的选择器. B + E: Any E element that is the next sibling of a B element (that is: the next child o ...
- html下拉框 js选中,js实现select下拉框选择
最近在做一个项目需要兼容到ie不同版本,在使用select时遇到了各种问题.后来索性就自己使用原生js实现了这样一个下拉框,话不多说,直接上代码吧. 自定义select *{ margin: 0; p ...
- Jquery 点击当前的标签对象获取值 与JS整理
太原 2019-6-24 工作经历 文章总结 在jquery中 div元素被点击时,使用 $(this) 获取当前div的id 使用 $(this).attr("id"); 获取当 ...
- jquery特效(6)—判断复选框是否选中进行答题提示
前面有一段时间思想开了小差,跟着师父学习了一段时间才发现差距很大,看来我要奋起直追~\(≧▽≦)/~啦啦啦. 最近公司在做一个项目,需要根据用户选择的选项给出相应的提示,下面来看我写的测试程序的效果: ...
- html单选框怎么用js实现选中状态,怎么用js代码改变单选框的选中状态
今天突然有一个需求要用到,使用js代码改变单选框的选中状态.当时想也不想直接 function doGender(gender) { if (gender == "男") { ge ...
最新文章
- datetime类型需要指定长度吗_你真的用对数据库了吗?
- 硬中断与软中断的区别!!!
- C#调用Win32 的API函数--User32.dll
- 苹果状态栏HTML,CSS3实现苹果电脑的DOCK菜单栏_html/css_WEB-ITnose
- linux tomcat apr安装,Linux下Tomcat8.0.44配置使用Apr的方法
- 使用EL表达式接收url的传值
- 【竞赛方案】2020腾讯广告算法大赛:高分进阶
- Java项目目录结构与解析
- android IntentService
- UWP 中的 LaunchUriAsync,使用默认浏览器或其他应用打开链接
- redis 清空缓存_「镜头回放」简直了!spring中清除redis缓存导致应用挂死
- __FILE__,__LINE__,FUNCTION__实现代码跟踪调试(linux下c语言编程 )(转自IT博客)
- HTTP协议请求头部的User-Agen和Cookie
- HTML translate 属性
- {“errcode“:44001,“errmsg“:“empty media data, hint: [1655962096234893527769663], from ip: 222.72.xxx.
- 推荐 10 个节省时间的 Mac 键盘快捷键
- Could not open Hibernate Session for transaction; nested exception is org.hibernate.exception.Generi
- iOS-规避iOS审核4.3规则的重心
- EeePC 1005ha(1008ha)安装Ubuntu的完美方案
- (zz)Lambda 表达式(C# 编程指南)
热门文章
- 奇遇网:WordPress版微信小程序开发:安装使用问题
- vue3.0+ts 找不到模块“./XXX.vue”或其相应的类型声明。
- 蓝桥杯 星系炸弹(第六届第二题)
- 【程序设计】散点密度图
- 关于RuntimeError: CUDA error: out of memory问题的解决方法
- 正则表达式提取网页中的网址
- “混乱“的 Windows 10 更新系统代理(下)
- PCIE协议解析 synopsys IP Power Management Capability 读书笔记(10)
- 【操作系统 · 内存】内存管理
- python pandas如何基于某一列修改某一列的值