JQuery勾选指定name的复选框集合并显示的方法
本文实例讲述了JQuery勾选指定name的复选框集合并显示的方法。分享给大家供大家参考。具体实现方法如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <script src="jquery-1.6.2.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $("input[name='love']").click(function () { //获得所有name为love的选中的复选框 var $Checks = $("input[name='love']:checked"); var arr = new Array(); //使用了元素的each方法 //循环Jquery对象里的dom数组 $Checks.each(function (index, value) { //alert(value); arr[index] = value.value; }); $("#MessageInfo").text("你选择了"+arr.length+"个爱好,"+arr.join(",")); }); }); </script> </head> <body> <input type="checkbox" name="love" value="FootBall" />足球 <input type="checkbox" name="love" value="BasketBall" />篮球 <input type="checkbox" name="love" value="VallyBall" />排球 <p id="MessageInfo"></p> </body> </html>
希望本文所述对大家的jQuery程序设计有所帮助。
相关推荐
-
JQuery判断checkbox是否选中及其它复选框操作方法合集
一.jquery判断checkbox是否选中及改变checkbox状态 jquery判断checked的三种方法: 复制代码 代码如下: .attr('checked): //看版本1.6+返回:"checked"或"undefined" ;1.5-返回:true或false .prop('checked'): //16+:true/false .is(':checked'): //所有版本:true/false//别忘记冒号哦 jquery赋值check
-
jQuery实现复选框批量选择与反选的方法
本文实例讲述了jQuery实现复选框批量选择与反选的方法.分享给大家供大家参考.具体实现方法如下: function selectAll(){ $('input[type|=checkbox]').attr('checked','checked'); } function cancelAll(){ $('input[type|=checkbox]').removeAttr('checked'); } 希望本文所述对大家的jQuery程序设计有所帮助.
-
jquery复选框多选赋值给文本框的方法
本文实例讲述了jquery复选框多选赋值给文本框的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jquery点击复选框触发事件给input赋值</title><base target="_blank" /> <m
-
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证
jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> &l
-
JQuery CheckBox(复选框)操作方法汇总
1. 获取单个checkbox选中项(三种写法): 复制代码 代码如下: $("input:checkbox:checked").val() 或者 复制代码 代码如下: $("input:[type='checkbox']:checked").val(); 或者 复制代码 代码如下: $("input:[name='ck']:checked").val(); 2. 获取多个checkbox选中项: 复制代码 代码如下: $('input:
-
JQuery限制复选框checkbox可选中个数的方法
本文实例讲述了JQuery限制复选框checkbox可选中个数的方法.分享给大家供大家参考.具体分析如下: 由于项目需要限制可批量操作的文件个数 所以写了一段小代码 如果选中个数大于允许的最大个数 其他复选框不能选择 如果小于则所有复选框都能选择 <script type="text/javascript"> $(document).ready(function() { $('input[type=checkbox]').click(function() { $("
-
jQuery切换所有复选框选中状态的方法
本文实例讲述了jQuery切换所有复选框选中状态的方法.分享给大家供大家参考.具体如下: 这段代码非常简单实用,通过链接切换所有checkbox是否选中 var tog = false; // or true if they are checked on load $('a').click(function() { $("input[type=checkbox]").attr("checked",!tog); tog = !tog; }); 希望本文所述对大家的jq
-
jquery操作复选框checkbox的方法汇总
本文实例汇总了jquery操作复选框checkbox的方法.分享给大家供大家参考.具体分析如下: jquery判断checked的三种方法: 复制代码 代码如下: $("input").attr("checked"); //版本1.6+返回:"checked"或"undefined" ,1.5-返回:true或false $("input").prop("checked"); /
-
jQuery实现统计复选框选中数量
代码很简介,功能也很简单,但是却很实用,这里就不细说明了直接上代码 jQuery代码: 复制代码 代码如下: function countNum(){ //alert($('input[name=check]:checked').length); var arrays = new Array(); var items = document.getElementsByName("check"); for(var
-
JQuery勾选指定name的复选框集合并显示的方法
本文实例讲述了JQuery勾选指定name的复选框集合并显示的方法.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&qu
-
jQuery.Sumoselect插件实现下拉复选框效果
简单介绍 jquery.sumoselect是一款跨设备.跨浏览器的jQuery下拉列表框插件.该jQuery下拉列表框插件可以单选,也可以多选.它的样式可以通过CSS文件来自定义.它的最大特点是可以跨设备使用,所有设备上功能都是一致的. 该jQuery下拉列表框插件的特点有: 可以进行单选,也可以进行多选. 可以通过CSS文件来自定义样式. 支持绝大多数的设备. 根据设备智能渲染. 在Android.IOS.Windows和其它设备上会自动渲染出该设备原生样式的下拉列表框. 可以自定义提交数据
-
jquery判断复选框是否被选中的方法
jquery 判断复选框是否选中以及如何选中的问题做一下总结. 进入正题,还是当页面有如下一组复选框的时候: <input type="checkbox" name="fruit" value="apple" />苹果 <input type="checkbox" name="fruit" value="orange" />橘子 <input type=&q
-
jquery复选框全选/取消示例
功能: a:实现点击复选框的时候全选所有的子复选框,再点击取消所有复选框的选中状态 b:有一个子复选框选中则父复选框选中 所有子复选框都不选中则父复选框不选中 复制代码 代码如下: /** * 全选函数 * @param mainId 主复选框id * @param klass 下属复选框的class */function selectAll(mainId,klass){ $("." + klass).each(function(){ if($("#" +
-
jQuery实现全选、反选和不选功能
本文给大家分享一段基于jQuery的全选.反选和不选功能的代码,适用于网页多选后需要进行批量操作的场景(如批量删除等).文章结合实例,代码简洁,基本覆盖选项选择操作的方方面面,希望可以帮到有需要的WEB爱好者. HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮. <ul id="list"> <li><label><input type="checkbox" val
-
jQuery实现全选、反选和不选功能的方法详解
本文实例讲述了jQuery实现全选.反选和不选功能的方法.分享给大家供大家参考,具体如下: 适用于网页多选后需要进行批量操作的场景(如批量删除等).如有问题希望大家可以指正.谢谢~~ HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮 <ul id="list"> <li><label><input type="checkbox" value="1"
-
Android复选框CheckBox与开关按钮Switch及单选按钮RadioButton使用示例详解
目录 前言 一.复选框CheckBox 二.开关按钮Switch 三.单选按钮RadioButton 单选组的用法 前言 CompoundButton在XML文件中主要使用下面两个属性. checked:指定按钮的勾选状态,true表示勾选,false则表示未勾选,默认为未勾选. button:指定左侧勾选图标的图形资源,如果不指定就使用系统的默认图标. CompoundButton在java代码中主要使用下列4种方法. setChecked:设置按钮的勾选状态. setButtonDrawab
-
javascript实现checkbox复选框实例代码
本文实例介绍了javascript实现checkbox复选框实例代码以及对checkbox复选框进行美化操作,分享给大家供大家参考,具体内容如下 1.checkbox复选框进行美化操作 复选框默认外表的美观度差强人意,能够满足美观度要求不高的页面,但是如果对于页面要求较为精致,那可能就过于勉强了,下面就一段对复选框进行美化的代码实例,希望能够给大家带来一定的帮助. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charse
-
jquery实现勾选复选框触发事件给input赋值
代码如下: 复制代码 代码如下: <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jquery点击复选框触发事件给input赋值-柯乐义</title><base target="_blank" /> <style type="text/css"> * { marg
-
jQuery判断复选框是否勾选的原理及示例
今天要实现一功能就是:复选框勾选时给input表单赋值,复选框取消时将表单值清除. 效果如图: 实现源码:cyfID为复选框的id 复制代码 代码如下: $("#cyfID").click(function(){ var ischeck=$(this).attr("checked"); if(ischeck==undefined){ //清除输入框 alert(""); }else{ //给输入框赋值 alert("qq")
随机推荐
- javascript字典探测用户名工具
- shell生成简单格式的xml实例
- ghost版系统安全设置方法
- linux之sort命令的用法
- Java_int、double型数组常用操作工具类(分享)
- swift 可选型的使用详解
- c#数据库与TXT导入导出的实例
- sizeof()的简单介绍
- PHP快速按行读取CSV大文件的封装类分享(也适用于其它超大文本文件)
- PHP 正则表达式常用函数
- Android教程之开机流程全面解析
- 关于MySql链接url参数的设置
- 总结PHP中数值计算的注意事项
- 基于JavaScript实现活动倒计时效果
- Yii2框架使用计划任务的方法
- Python中用pycurl监控http响应时间脚本分享
- Python HTTP客户端自定义Cookie实现实例
- Ajax动态为下拉列表添加数据的实现方法
- 纯原生js实现贪吃蛇游戏
- sql2005 附加数据库出错(错误号:5123)解决方法