JS获取checkbox的个数简单实例

作者:jingxian 时间:2023-08-20 15:17:55 

JS获取多选框checkbox被选中的个数。


var checkbox = document.getElementsByName("likes[]");
//此处通过此种方式才能获得多选框为数组。

//like为name = "like[]" , 获得时必须加上[]
var checked_counts = 0;

for(var i=0;i<checkbox.length;i++){
if(checkbox[i].checked){     //被选中的checkbox
checked_counts++;
}
}

alert(checked_counts);

 我做的是每点击一下多选框就判断当前checked个数是否超过某个数值


function checkDate(){
 var n = $("#cart_q_num").val();
  var checkedCount=0;
  var checkbox = document.getElementsByName("tie_in[]");
  //alert(checkbox.length);
  for(var i=0;i<checkbox.length ;i ++){
  if(checkbox[i].checked){
    checkedCount++;

}
  }
  //alert(checkedCount);
   if(checkedCount>n){
      alert("The quantity of the gifts should equal to the quantity of the sunglasses set.");
     return false;
  }else{
    $("#free_pro_selected_num").html(checkedCount);
   }
}

要使函数checkdata()每次点击都发挥作用,需要在checkbox框中添加onclick事件:


<input type="checkbox" name="tie_in[]" value="1" onClick="return checkData()" />
标签:js,checkbox
0
投稿

猜你喜欢

  • XML十项特点

    2008-04-05 13:49:00
  • Python实现对PPT文件进行截图操作的方法

    2021-10-14 13:25:19
  • 如何在网页中制作虚线表格

    2010-10-20 20:07:00
  • 轻松在线制作各种Logo标志

    2008-05-26 12:54:00
  • numpy中nan_to_num的具体使用

    2021-10-31 13:04:55
  • Javascript文本框脚本实现方法解析

    2024-04-25 10:36:22
  • laravel框架关于搜索功能的实现

    2024-05-03 15:27:54
  • Golang巧用defer进行错误处理的方法

    2023-08-05 03:21:13
  • Sql server 2005安装时ASP.Net版本注册要求警告的解决方法

    2024-01-18 16:16:55
  • Python + selenium + requests实现12306全自动抢票及验证码破解加自动点击功能

    2021-07-24 04:50:52
  • 浅谈python日志的配置文件路径问题

    2021-01-17 23:39:51
  • 彻底终结浏览器Cache页面的解决方案

    2008-04-21 15:10:00
  • opencv模板匹配相同位置去除重复的框

    2022-03-09 04:06:14
  • python批量添加zabbix Screens的两个脚本分享

    2022-07-21 02:17:28
  • Python中的 ansible 动态Inventory 脚本

    2022-10-23 07:53:08
  • Python中itertools模块的使用教程详解

    2023-08-24 03:07:25
  • python读写ini文件示例(python读写文件)

    2023-06-21 03:10:14
  • python机器学习之决策树分类详解

    2023-04-28 14:31:05
  • echarts学习之如何给饼图中间添加文字

    2024-05-03 11:10:30
  • Go+Kafka实现延迟消息的实现示例

    2024-05-22 10:14:29
  • asp之家 网络编程 m.aspxhome.com