`

jquery判断checkbox(复选框)是否被选中的代码

 
阅读更多

$("input[name='versioncb']:checkbox").each(function () { 
if ($(this).attr("checked")) { 
$("#versiondiv").css('display','block');
}else{
$("#versiondiv").css('display','none');
} 
})

1:判断radio

var selected = $('input[name=selectid:checked]').val();//若未被选中 则val() = null 
if(selected == null){ 
alert("未选中!"); 
}else{ 
alert("选中!"); 
} 
2:判断checkbox
代码如下:
var n = $("input:checked").length; 
if(n==0){ 
alert("未选中!"); 
}else{ 
alert("选中!"); 
} 
$("div").text(n + (n <= 1 ? " is" : " are") + " checked!"); 
3:checkbox数组全选、取消全选 
$("#selAll").click(function(){ 
$("input[name='cbox[]']").attr("checked",$(this).attr("checked")); 
});

http://www.jb51.net/article/25040.htm

 

//是否被选中验证有选中的return true,否return false

function mycheckbox() { 
var falg = 0; 
$("input[name='soft[]']:checkbox").each(function () { 
if ($(this).attr("checked")) { 
falg += 1; 
} 
}) 
if (falg > 0) 
return true; 
else 
return false; 
} 
 

这是一个比较不错的方法,收藏了。
下面这个函数是对上面的补充:
复制代码
代码如下:

本来就是这种写法啊。jq1.42的写法。
其次,建议你的逻辑处理
function mycheckbox() { 
var falg = 0; 
$("input[name='soft[]']:checkbox").each(function () { 
if ($(this).attr("checked")) { 
falg =1; 
return false; 
} 
}) 
if (falg > 0) 
return true; 
else 
return false; 
}
下面是简单的判断
jquery核心判断语句判断语句

if($('input:checkbox').attr("checked")==true) 
谁都知道 在html 如果一个复选框被选中 是 checked="checked"。
但是我们如果用jquery alert($("#id").attr("checked")) 会提示您是true而不是checked
所以很多朋友判断 if($("#id").attr("checked")=="true") 这个是错误的,其实应该是 if($("#id").attr("checked")==true)

例子里面包括了一下几个功能。
<input type="button" id="btn1" value="全选"> 
<input type="button" id="btn2" value="取消全选"> 
<input type="button" id="btn3" value="选中所有奇数"> 
<input type="button" id="btn4" value="反选"> 
<input type="button" id="btn5" value="获得选中的所有值"> 
 
代码

复制代码
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<SCRIPT LANGUAGE="JavaScript" src="http://www.cnjquery.com/demo/jquery.js"></script > 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
$("document").ready(function(){ 
$("#btn1").click(function(){ 
$("[name='checkbox']").attr("checked",'true');//全选 
}) 
$("#btn2").click(function(){ 
$("[name='checkbox']").removeAttr("checked");//取消全选 
}) 
$("#btn3").click(function(){ 
$("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 
}) 
$("#btn4").click(function(){ 
$("[name='checkbox']").each(function(){ 

if($(this).attr("checked")) 
{ 
$(this).removeAttr("checked"); 
} 
else 
{ 
$(this).attr("checked",'true'); 
} 
}) 
}) 
$("#btn5").click(function(){ 
var str=""; 
$("[name='checkbox'][checked]").each(function(){ 
str+=$(this).val()+""r"n"; 
//alert($(this).val()); 
}) 
alert(str); 
}) 
}) 
//--> 
</SCRIPT> 
</HEAD> 
<BODY> 
<form name="form1" method="post" action=""> 
<input type="button" id="btn1" value="全选"> 
<input type="button" id="btn2" value="取消全选"> 
<input type="button" id="btn3" value="选中所有奇数"> 
<input type="button" id="btn4" value="反选"> 
<input type="button" id="btn5" value="获得选中的所有值"> 
<br> 
<input type="checkbox" name="checkbox" value="checkbox1"> 
checkbox1 
<input type="checkbox" name="checkbox" value="checkbox2"> 
checkbox2 
<input type="checkbox" name="checkbox" value="checkbox3"> 
checkbox3 
<input type="checkbox" name="checkbox" value="checkbox4"> 
checkbox4 
<input type="checkbox" name="checkbox" value="checkbox5"> 
checkbox5 
<input type="checkbox" name="checkbox" value="checkbox6"> 
checkbox6 
<input type="checkbox" name="checkbox" value="checkbox7"> 
checkbox7 
<input type="checkbox" name="checkbox" value="checkbox8"> 
checkbox8 
</form> 
代码如下:
/************单个checkbox全选************************/
function clickCheckbox() { 
if($("#checkPathAll").attr("checked")) 
{ 
$("input[name='checkPath']").each(function() { 
$(this).attr("checked", true); 
}); 
} 
else 
{ 
$("input[name='checkPath']").each(function() { 
$(this).attr("checked", false); 
}); 
} 
}
分享到:
评论

相关推荐

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

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

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

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

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

    标题提到的“jquery判断复选框是否被全部选中,达到全选的目的”,就是针对这一需求的具体实现。下面我们将详细探讨如何利用jQuery来完成这个功能。 首先,我们需要理解jQuery库的基本用法。jQuery是一个广泛使用的...

    jQuery基于layui插件制作checkbox复选框选中代码

    在本文中,我们将深入探讨如何使用jQuery和layui插件来创建功能丰富的checkbox复选框,包括权限范围的多选、单选以及全选操作。同时,我们也将关注于父级和子级复选框之间的联动关系,即父级选中时子级全部选中,而...

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

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

    jQuery多级复选框checkbox选中代码

    基本的复选框选中和取消选中的jQuery代码如下: ```javascript $('input[type="checkbox"]').click(function() { $(this).prop('checked', !$(this).is(':checked')); }); ``` 这段代码监听了所有类型为"checkbox...

    基于jQuery的CheckBox复选框代码,效果很酷哦

    你可以打开`README.md`文件获取更多关于项目的说明,而`基于jQuery的CheckBox复选框代码,效果很酷哦`可能是实际的代码文件,可以查看并学习其中的实现细节。 总的来说,使用jQuery创建自定义复选框是提升网页交互...

    jquery判断复选框是否被选中的方法

    jquery 判断复选框是否选中以及如何选中的问题做一下总结。 进入正题,还是当页面有如下一组复选框的时候: &lt;input type=checkbox name=fruit value=apple /&gt;苹果 &lt;input type=checkbox name=fruit value...

    jQuery树形复选框插件.zip

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

    Prototype与jQuery美化Checkbox复选框实例.zip

    "Prototype与jQuery美化Checkbox复选框实例"这个压缩包文件正是针对这一需求提供的一种解决方案。下面,我们将详细探讨Prototype和jQuery库在美化Checkbox上的应用以及相关的前端知识点。 首先,Prototype是一个...

    jQuery多级复选框checkbox选中代码.zip

    本文将深入探讨如何使用jQuery实现多级复选框的功能,通过分析提供的"jQuery多级复选框checkbox选中代码.zip"中的示例,我们将了解其实现原理及应用。 首先,"index.html"是项目的入口文件,它包含了页面的基本结构...

    隐藏layui数据表格表头的checkbox复选框

    ### 隐藏LayUI数据表格表头的Checkbox复选框方法详解 #### 背景介绍 在前端开发过程中,经常会使用到LayUI框架搭建网页应用,尤其是在设计复杂的数据展示界面时,LayUI提供了强大的数据表格功能。然而,在某些场景...

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

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

    jquery 复选框组件

    **jQuery 复选框组件详解** 在Web开发中,复选框(Checkbox)是一种常见的用户交互元素,用于让用户从多个选项中选择一个或多个。jQuery,作为一款强大的JavaScript库,提供了丰富的插件和方法来增强复选框的功能和...

    jquery checkbox 选中 取消 checkbox多选

    本文将深入探讨如何使用jQuery来实现复选框(checkbox)的选中和取消选中功能,以及如何处理多选的情况。 首先,我们需要理解HTML中的`&lt;input&gt;`元素类型为"checkbox"的基本用法。复选框用于让用户从多个选项中选择...

    绚丽的复选框 jquery-checkbox

    **绚丽的复选框 jQuery-Checkbox** 在网页设计中,复选框(checkbox)是常见的交互元素,用于让用户选择一个或多个选项。然而,原始的HTML复选框样式通常较为简单,缺乏吸引力。为了提升用户体验和界面美观度,...

    jQuery基于layui插件制作checkbox复选框选中代码.zip

    本项目是基于jQuery和layui插件制作的checkbox复选框选中代码,非常适合那些需要在网页上实现复选框功能的开发者。 首先,`index.html`是项目的主页面文件,它包含了HTML结构和引用的外部资源。在HTML中,你需要...

    jQuery自定义美化复选框checkbox样式

    本项目专注于使用jQuery来美化复选框(checkbox)的样式,为用户提供更加美观和定制化的界面体验。 首先,复选框是HTML中一种基本的表单元素,通常用于让用户在多个选项中进行多选。然而,浏览器默认的复选框样式...

    实现table表格checkbox复选框的全选 反选

    1. 当全选复选框被点击时,如果它被选中(`:checked`),则所有行内复选框(`.itemCheckbox`)都被设置为选中状态;反之,所有行内复选框都被取消选中。 2. 当行内复选框被点击时,我们检查当前所有行内复选框是否都...

    jQuery弹出框checkbox复选框多选代码.zip

    在给定的压缩包"jQuery弹出框checkbox复选框多选代码.zip"中,我们可以看到两个核心文件:`index.html`和`jquery-1.9.1.min.js`。这些文件共同构成了一个简单的jQuery应用,用于实现弹出框内的多选复选框功能。 ...

Global site tag (gtag.js) - Google Analytics