jQuery实现获取多选框的值示例


Posted in jQuery onFebruary 07, 2020

本文实例讲述了jQuery实现获取多选框的值。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>3water.com jQuery获取多选框的值</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  </head>
  <body>苹果:
    <input type="checkbox" name="id" value="aa">香蕉:
    <input type="checkbox" name="id" value="bb">橘子:
    <input type="checkbox" name="id" value="cc">
    <button id="btn">批量删除</button>
  </body>
  <script>
  $('#btn').click(function () {
    var id=[];
    $("input[name='id']:checked").each(function(){
      id.push($(this).val());
    });
    console.log(id);
  });
  </script>
</html>

运行效果

 jQuery实现获取多选框的值示例

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery实现字体颜色渐变效果的方法
Mar 29 jQuery
jQuery实现鼠标滑过预览图片大图效果的方法
Apr 26 jQuery
jQuery回调方法使用示例
Jun 26 jQuery
jQuery实现菜单栏导航效果
Aug 15 jQuery
JQuery 获取多个select标签option的text内容(实例)
Sep 07 jQuery
jQuery使用zTree插件实现可拖拽的树示例
Sep 23 jQuery
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
jQuery实现的滑块滑动导航效果示例
Jun 04 jQuery
jQuery对底部导航进行跳转并高亮显示的实例代码
Apr 23 jQuery
jQuery操作cookie的示例代码
Jun 05 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
jquery实现鼠标悬浮弹出气泡提示框
Dec 23 jQuery
jQuery操作选中select下拉框的值代码实例
Feb 07 #jQuery
如何使用Jquery动态生成二级选项列表
Feb 06 #jQuery
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 #jQuery
9种方法优化jQuery代码详解
Feb 04 #jQuery
jQuery实现小火箭返回顶部特效
Feb 03 #jQuery
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
Feb 01 #jQuery
Jquery Datatables的使用详解
Jan 30 #jQuery
You might like
DC动画很好看?新作烂得令人发指,名叫《红色之子》
2020/04/09 欧美动漫
4月1日重磅发布!《星际争霸II》6.0.0版本更新
2020/04/09 星际争霸
PHP读MYSQL中文乱码的解决方法
2006/12/17 PHP
浏览器预览PHP文件时顶部出现空白影响布局分析原因及解决办法
2013/01/11 PHP
PHP生成迅雷、快车、旋风等软件的下载链接代码实例
2014/05/12 PHP
PHP获取时间排除周六、周日的两个方法
2014/06/30 PHP
Yii2 rbac权限控制操作步骤实例教程
2016/04/29 PHP
php微信公众号开发之答题连闯三关
2018/10/20 PHP
JavaScript delete 属性的使用
2009/10/08 Javascript
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
2012/10/12 Javascript
js捕获鼠标右键菜单中的粘帖事件实现代码
2013/04/01 Javascript
JavaScript中的noscript元素属性位置及作用介绍
2013/04/11 Javascript
jquery slibings选取同级其他元素的实现代码
2013/11/15 Javascript
Jquery下EasyUI组件中的DataGrid结果集清空方法
2014/01/06 Javascript
JavaScript中匿名函数用法实例
2015/03/23 Javascript
javascript实时显示当天日期的方法
2015/05/20 Javascript
利用jQuery实现CheckBox全选/全不选/反选的简单代码
2016/05/31 Javascript
JS中正则表达式只有3种匹配模式(没有单行模式)详解
2016/07/28 Javascript
Javascript 实现简单计算器实例代码
2016/10/23 Javascript
js canvas实现简单的图像扩散效果
2020/06/28 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
2020/01/17 Javascript
基于 Vue 的 Electron 项目搭建过程图文详解
2020/07/22 Javascript
nodeJs项目在阿里云的简单部署
2020/11/27 NodeJs
详细解读tornado协程(coroutine)原理
2018/01/15 Python
python中break、continue 、exit() 、pass终止循环的区别详解
2019/07/08 Python
python对绑定事件的鼠标、按键的判断实例
2019/07/17 Python
Python3.x+pyqtgraph实现数据可视化教程
2020/03/14 Python
利用python在excel中画图的实现方法
2020/03/17 Python
python实现图片,视频人脸识别(opencv版)
2020/11/18 Python
国际礼品店:GiftsnIdeas
2018/05/03 全球购物
递归实现回文判断(如:abcdedbca就是回文,判断一个面试者对递归理解的简单程序)
2013/04/28 面试题
EJB实例的生命周期
2016/10/28 面试题
开会迟到检讨书
2014/01/08 职场文书
小学生美德少年事迹材料
2014/08/24 职场文书
有关浪费资源的建议书
2015/09/14 职场文书
Python matplotlib安装以及实现简单曲线的绘制
2022/04/26 Python