`
linksys
  • 浏览: 808 次
  • 性别: Icon_minigender_1
文章分类
社区版块
存档分类
最新评论

jquery复选框

阅读更多
$("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 复选框组件

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

    Jquery复选框美化

    "Jquery复选框美化"和"单选按钮美化"正是关注这个领域的技术实践。jQuery,一个强大的JavaScript库,为开发者提供了丰富的API和插件,使得这些基础的HTML元素能够变得更加吸引人和功能强大。 首先,复选框和单选...

    jquery复选框_全选_反选_取消_选中输出等功能用jquery特效和jquery插件两种表单特效

    ### 使用jQuery实现复选框全选、反选、...&lt;title&gt;jQuery复选框全选反选取消选中输出等功能用jQuery特效和jQuery插件两种特效 &lt;script type="text/javascript" src="http://www.mailuke.com/js/jquery-1.2.6.pack.js"&gt; ...

    jquery 复选框 全选,全不选

    本话题主要关注如何使用jQuery来实现复选框的全选和全不选功能。在HTML页面中,复选框是一种常见的表单元素,用于让用户可以选择多个选项中的一个或多个。全选和全不选功能则为用户提供了一种便捷的方式来一次性选择...

    jquery复选框全选操作

    在本示例中,我们将聚焦于jQuery实现复选框的全选与反选功能,这对于创建数据筛选或批量操作的用户界面非常有用。下面将详细介绍这个功能的实现方式。 首先,我们需要在HTML页面中设置一组复选框,通常我们会为这些...

    Jquery复选框的值

    在"Jquery复选框的值"这个主题中,我们将探讨如何利用jQuery实现批量获取复选框的值,并通过一个简单的`index.jsp`示例来阐述这一过程。 首先,我们需要了解HTML中复选框的基本结构。复选框通常使用`&lt;input&gt;`元素的...

    jquery复选框产品对比功能

    在“jquery复选框产品对比功能”这个项目中,我们主要探讨的是如何利用jQuery来实现一个类似于淘宝购物车的产品对比功能。这个功能允许用户通过复选框选择商品,然后在右侧悬浮窗口展示所选产品的详细信息,同时提供...

    jquery 复选框

    本文将深入探讨如何使用 jQuery 来处理复选框(checkboxes),包括实现全选、反选功能,并获取复选框的属性值。 ### 1. 复选框基本操作 在 HTML 中,复选框是通过 `&lt;input&gt;` 标签的 `type="checkbox"` 属性来创建...

    jQuery的复选框操作-实例页面

    在提供的`arrtest.html`文件中,我们可以预期看到一个包含jQuery复选框操作的示例页面。这个页面可能包含一些交互式复选框,演示了上述提到的功能,如事件监听、状态改变和视觉效果。通过查看和分析源代码,我们可以...

    jquery复选框选中按钮.rar

    本资源“jquery复选框选中按钮.rar”似乎包含了一个关于如何使用jQuery来控制复选框(checkbox)状态的示例,特别是与按钮(button)交互的情景。在网页开发中,复选框和按钮是常见的表单元素,用于收集用户输入或...

    jquery 复选框 选择三个后不可在选写法

    标题提到的"jquery 复选框 选择三个后不可再选写法"是指在网页中,当用户选择达到三个复选框后,禁止他们继续选择其他复选框。这种功能在多种场景下都非常实用,比如在在线调查、问卷或购物促销活动中,限制用户最多...

    jquery复选框产品对比功能.zip

    标题中的“jquery复选框产品对比功能.zip”表明这是一个基于jQuery实现的,用于产品对比的Web功能。在HTML5的背景下,这个功能可能是利用jQuery库来增强网页的交互性,特别是处理用户通过复选框进行产品选择和比较的...

    jquery特效制作复选框,全选,反选,取消,购物车,统计价格,统计

    在这个项目中,我们关注的是使用jQuery来实现一些特定的功能,这些功能包括复选框的操作(全选、反选、取消选择)以及购物车中的商品价格统计。 首先,让我们深入了解一下复选框的操作。在HTML中,复选框是通过`...

    JQuery 简单的带复选框的树形结构

    但是最近公司需要做一个带复选框的树形结构,并且最关键的是要嵌入到JSP页面中,传递的数据不是用JSON传递的,是直接通过后端跳JSP页面的方式来的,所以就没有用网上的插件,就自己写了一下简单的实现。

    使用JQuery制作复选框的全选或单选特效

    本教程将深入探讨如何使用jQuery实现复选框的全选和单选特效,为用户界面添加交互性和动态性。 首先,我们需要理解HTML中的复选框(`&lt;input type="checkbox"&gt;`)的基本用法。复选框允许用户从多个选项中选择一个或...

    Jquery 复选框选中之后 按钮才能点击

    2. **选择复选框和按钮**:使用Jquery的选择器选取复选框和按钮。例如,如果复选框的ID为"check",按钮的ID为"submit",则选取方式如下: ```javascript var checkbox = $('#check'); var button = $('#submit'); ``...

    jquery实现下拉复选框

    一个js的方法,调用该js可实现下拉复选框。 /**//** * Creat date 2011-11-10 * Creat by zhuoyueping *支持input表单的下拉复选框。 *使用方法: * (1)调用js函数:setSelectBox(textItem, myArray); *...

    jQuery单选框跟复选框美化代码.zip

    "jQuery单选框跟复选框美化代码.zip"这个资源提供了一种方法,使得开发者可以优雅地对网页中的单选框(radio buttons)和复选框(checkboxes)进行样式定制,提升用户体验。 首先,我们要理解单选框和复选框在HTML...

    jQuery复选框美化插件labelauty

    总的来说,jQuery labelauty插件为复选框和单选框提供了简单而强大的美化解决方案,使得网页的表单元素变得更加吸引人,同时也提高了用户体验。结合适当的配置和定制,它可以轻松融入各种网站设计中。通过参考官方...

Global site tag (gtag.js) - Google Analytics