`
ssxxjjii
  • 浏览: 950613 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS jQuery分别获取选中的复选框值

 
阅读更多
Html代码  收藏代码
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
  2. <html>  
  3. <head>  
  4. <style>  
  5.   
  6. </style>  
  7. <title>JS获取复选框被选中的值</title>  
  8. </head>  
  9. <body>  
  10. <input type="checkbox" name="test" value="0" />0&nbsp;&nbsp;  
  11. <input type="checkbox" name="test" value="1" />1&nbsp;&nbsp;  
  12. <input type="checkbox" name="test" value="2" />2&nbsp;&nbsp;  
  13. <input type="checkbox" name="test" value="3" />3&nbsp;&nbsp;  
  14. <input type="checkbox" name="test" value="4" />4&nbsp;&nbsp;  
  15. <input type="checkbox" name="test" value="5" />5&nbsp;&nbsp;  
  16. <input type="checkbox" name="test" value="6" />6&nbsp;&nbsp;  
  17. <input type="checkbox" name="test" value="7" />7&nbsp;&nbsp;  
  18. <input type="button" onclick="chk()" value="提  交" />  
  19. </body>  
  20. </html>  

 

Js代码  收藏代码
  1. <script src="jquery.js"></script><!--这是载入jquery.js文件,如果不使用jquery可以去掉-->  
  2. <script>  
  3. function chk(){  
  4.   var obj=document.getElementsByName('test');  //选择所有name="'test'"的对象,返回数组  
  5.   //取到对象数组后,我们来循环检测它是不是被选中  
  6.   var s='';  
  7.   for(var i=0; i<obj.length; i++){  
  8.     if(obj[i].checked) s+=obj[i].value+',';  //如果选中,将value添加到变量s中  
  9.   }  
  10.   //那么现在来检测s的值就知道选中的复选框的值了  
  11.   alert(s==''?'你还没有选择任何内容!':s);  
  12. }  
  13.   
  14. function jqchk(){  //jquery获取复选框值  
  15.   var chk_value =[];  
  16.   $('input[name="test"]:checked').each(function(){  
  17.    chk_value.push($(this).val());  
  18.   });  
  19.   alert(chk_value.length==0 ?'你还没有选择任何内容!':chk_value);  
  20. }  
  21. </script>  

 

分享到:

相关推荐

    jQuery分别获取选中的复选框值

    首先,让我们关注标题提及的主题——"jQuery分别获取选中的复选框值"。在HTML中,复选框通常用`&lt;input type="checkbox"&gt;`标记创建,而它们的值可以通过`value`属性设定。当用户勾选一个复选框时,jQuery提供了一些...

    jquery实现 复选框 选中和不选中 美化复选框

    本文将详细介绍如何使用jQuery实现复选框的选中与不选中效果的美化。 首先,我们需要理解jQuery的基本用法。jQuery库简化了JavaScript中的DOM操作、事件处理和动画效果。引入jQuery库后,我们可以使用$(document)....

    jQuery实现获取选中复选框的值实例详解

    在讨论如何使用jQuery获取选中复选框的值之前,让我们先了解一些基础概念。复选框是一种表单元素,允许用户选择多个选项中的零个或多个。通常,复选框通过value属性与某个特定值相关联,而在页面上可以通过为复选框...

    jQuery单选框和复选框美化代码

    4. **状态管理**:通过jQuery,我们可以轻松地获取或设置单选框和复选框的选中状态,这对于动态更新界面或者验证用户输入非常有用。 5. **响应式设计**:在移动设备上,美化后的单选框和复选框同样重要。jQuery可以...

    jQuery如何判断checkbox(复选框)是否被选中

    在探讨如何使用jQuery判断复选框(checkbox)是否被选中的过程中,我们首先需要理解复选框的基本属性以及jQuery操作DOM元素的方式。复选框在HTML中被定义为`&lt;input type="checkbox"&gt;`,当它被选中时,其`checked`属性...

    jQuery树形复选框插件.zip

    《jQuery树形复选框插件的深度解析与应用》 在Web开发中,为了提供用户友好的交互体验,我们经常需要实现各种各样的UI组件。其中,树形结构的复选框是一种常见且实用的功能,它允许用户以层级方式选择或取消选择一...

    js 实现选一个复选框 可以实现其他很多复选框同时选中

    在本文中,我们将探讨如何利用JavaScript(简称JS)和jQuery框架来实现一个实用的功能:通过选择一个主复选框来控制其他多个复选框的状态以及关联文本框的显示与隐藏。该功能在用户界面设计中非常常见,尤其是在表单...

    jquery动态复选框取值

    三、获取复选框值 获取复选框的值通常有以下两种方式: 1. `prop()`方法:`prop()`用于获取或设置元素的属性值。对于复选框,我们可以用它来获取`checked`属性,判断复选框是否被选中。 ```javascript // 检查复选...

    jQuery高性能带复选框的树形结构插件

    **jQuery高性能带复选框的树形结构插件——highchecktree** 在Web开发中,树形结构常常用于展示层级关系的数据,例如组织结构、文件系统等。`highchecktree`是一个专门针对这种情况设计的jQuery插件,它能高效地...

    jquery获取复选框checkbox的值的简单实现方法

    在这个过程中,我们使用jQuery的`.val()`方法获取每一个复选框的`value`属性值,并通过`push()`方法将这些值添加到一个预先定义的数组中。这种方式更加简洁明了,并且利用了jQuery提供的方法来简化操作。 最后,...

    jquery 、js实现复选框 (全选、反选)

    ### 使用jQuery和JavaScript实现复选框的全选与反选功能 在Web开发中,复选框(checkbox)是常用的一种交互元素,特别是在表格或列表中用于选择多个项目时非常实用。本文将详细介绍如何利用jQuery和原生JavaScript...

    jquery 复选框组件

    jQuery,作为一款强大的JavaScript库,提供了丰富的插件和方法来增强复选框的功能和用户体验。本篇文章将详细探讨jQuery中的复选框组件,特别是基于jQuery UI的Multiselect插件。 ### jQuery 复选框基础 在HTML中...

    BootStrap Table复选框默认选中功能的实现代码(从数据库获取到对应的状态进行判断是否为选中状态)

    本篇将详细介绍如何在Bootstrap Table中实现复选框的默认选中功能,特别地,我们将根据从数据库获取的状态来决定复选框是否被选中。 首先,我们需要引入Bootstrap Table的相关库,包括CSS和JavaScript文件。这些...

    Jquery复选框的值

    `map()`函数遍历这些复选框,并返回每个选中复选框的`value`属性。最后,`.get()`方法将结果转换为JavaScript数组。 在`index.jsp`文件中,你可以将上述代码添加到`&lt;script&gt;`标签内,或者链接到外部的JavaScript...

    jquery 实现鼠标单击行时,选中checkbox复选框

    jquery 实现鼠标单击行时,改变行的背景颜色,选中checkbox复选框

    jquery获取checkbox选中的值

    在本场景中,我们关注的是如何使用jQuery来处理HTML中的复选框(checkbox)元素,尤其是获取选中的值、实现全选、取消全选、反选以及选择奇数行的操作。下面将详细介绍这些知识点。 1. **获取选中的值** jQuery ...

    jquery获取复选框checkbox的值实现方法

    //js获取复选框值 var obj = document.getElementsByName("interest");//选择所有name="interest"的对象,返回数组 var s='';//如果这样定义var s;变量s中会默认被赋个null值 for(var i=0;i&lt;obj.length;i++){ ...

    jquery判断复选框是否被全部选中,达到全选的目的

    如果某个复选框被选中,`$check`的值就会增加。 `if($check==$checkArray.length)`这部分代码用于判断所有复选框是否都被选中。如果`$check`等于`$checkArray.length`,说明所有复选框都已被选中;反之,如果它们不...

    jquery下拉多选复选框插件

    本主题涉及的是一个基于jQuery的下拉多选复选框插件,该插件能够提供用户友好的界面,方便用户在下拉菜单中进行多选操作,尤其适用于后台数据管理或前端交互场景。下面将详细介绍这个插件及其相关的知识点。 1. **...

    jquery获取复选框被选中的值

    - **获取所有选中复选框的值**:通过点击事件触发函数,遍历所有选中的复选框,并将其值拼接在一起,最后显示出来。 5. **事件绑定**: 为了使复选框与上述操作关联起来,需要使用事件处理器来绑定点击事件。文档...

Global site tag (gtag.js) - Google Analytics