JQuery对checkbox操作 (循环获取)_jquery

复制代码 代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DemoCheckBox.aspx.cs" Inherits="DemoCheckBox" %>
<!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 runat="server">
<title>无标题页</title>
<script src="js/jquery-1.6.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function($){
//全选
$("#btn1").click(function(){
$("input[name='checkbox']").attr("checked","true");
})
//取消全选
$("#btn2").click(function(){
$("input[name='checkbox']").removeAttr("checked");
})
//选中所有基数
$("#btn3").click(function(){
$("input[name='checkbox']:even").attr("checked","true");
})
//选中所有偶数
$("#btn6").click(function(){
$("input[name='checkbox']:odd").attr("checked","true");
})
//反选
$("#btn4").click(function(){
$("input[name='checkbox']").each(function(){
if($(this).attr("checked"))
{
$(this).removeAttr("checked");
}
else
{
$(this).attr("checked","true");
}
})
})
//或许选择项的值
var aa="";
$("#btn5").click(function(){
$("input[name='checkbox']:checkbox:checked").each(function(){
aa+=$(this).val()
})
document.write(aa);
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="button" id="btn1" value="全选">
<input type="button" id="btn2" value="取消全选">
<input type="button" id="btn3" value="选中所有奇数">
<input type="button" id="btn6" 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
</div>
</form>
</body>
</html>

jquery 循环读取checkbox值

复制代码 代码如下:

$("input[type=checkbox][checked]").each(function(){ //由于复选框一般选中的是多个,所以可以循环输出
alert($(this).val());
});

时间: 2024-08-04 02:41:17

JQuery对checkbox操作 (循环获取)_jquery的相关文章

jQuery 中DOM 操作详解_jquery

jQuery 中的 DOM 操作 DOM(Document Object Model-文档对象模型):一种与浏览器,平台, 语言无关的接口,使用该接口可以轻松地访问页面中所有的标准组件 DOM 操作的分类: DOM Core: DOM Core 并不专属于 JavaScript, 任何一种支持 DOM的程序设计语言都可以使用它. 它的用途并非仅限于处理网页,也可以用来处理任何一种是用标记语言编写出来的文档, 例如: XML HTML DOM: 使用 JavaScript和 DOM 为 HTML文

jquery读写cookie操作实例分析_jquery

本文实例分析了jquery读写cookie操作.分享给大家供大家参考,具体如下: jquery cookie需要脚本文件如下: jQuery.cookie = function(name, value, options) { if (typeof value != 'undefined') { options = options || {}; if (value === null) { value = ''; options = $.extend({}, options); options.ex

jQuery中用dom操作替代正则表达式_jquery

在B/S结构客户端越来越"胖"的今天,作为一名全端程序员,您很可能会在前端操作html字符串,注意,是操作html字符串,不是操作当前页面的html.          举个例子,百度推出的在线HTML富文本编辑器Ueditor,可以在线制作富文本文档,功能堪比精简版的Microsoft Word.虽然Ueditor身披百度的光环,但实际效果不太让人满意,我们需要二次处理一下它生成的html字符串,比如把所有图片的宽度设成90%.          通过某个方法,我们可以拿到文本编辑器

jQuery中DOM操作实例分析_jquery

本文实例讲述了jQuery中DOM操作的方法.分享给大家供大家参考.具体分析如下: 这里主要设计的dom操作包括:dom对象的创建(JS方式和jquery方式).属性的修改.样式的修改.动态绑定事件 代码如下: 复制代码 代码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript" src="jquery-1.3.

jQuery链式操作实例分析_jquery

本文实例讲述了jQuery链式操作.分享给大家供大家参考,具体如下: 从过去的实例中,我们知道jQuery语句可以链接在一起,这不仅可以缩短代码长度,而且很多时候可以实现特殊的效果. <script type="text/javascript"> $(function() { $("div").addClass("css1").filter(function(index) { return index == 1 || $(this).

jQuery中:checkbox选择器用法实例_jquery

本文实例讲述了jQuery中:checkbox选择器用法.分享给大家供大家参考.具体分析如下: 此选择器能够匹配所有复选框. 语法结构: 复制代码 代码如下: $(":checkbox") 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content=&quo

Jquery 实现checkbox全选方法_jquery

昨天早上有写到怎么利用Jquery实现全选 根据大家的意见对程序中一些写法不好的地方进行了修改,也是本人水平有限,存在各种考虑不到的地方. 文章最后我提出了一个问题,要写一个通用的方法来调用,于是就有了现在的这篇文章,晚上回到家,我就写出了效果 下面的例子可以供大家讨论学习,如果觉得不错也可以直接应用到项目中. 1:为什么要写这个方法    网上实现一句话全选全不选的有很多,但是好像都忽略了一个问题,全选的checkbox可以控制下面的子checkbox,但是下面的子checkbox应该也可以控

关于锚点跳转及jQuery下相关操作与插件_jquery

一.锚点跳转简介 锚点嘛,业余点的解释就是可以让页面定位到某个位置的点.在高度较高的页面中经常见到,例如,百度百科页面,<火影忍者>这个词条,结果就会看到如下的锚点列表: 点击其中一个链接,就会跳转到页面的相应位置.这就是锚点的作用之一.锚点还可以用在跳转到其他页面的相应位置,例如我的博客,点击博客首页文章下面的评论链接,则会跳转到文章的评论处. 起关键作用的就是链接地址后面跟着的#comments,见下图标示: 我知道的实现锚点跳转有两种方式,一种是a标签+name属性,还有一种就是使用标签

JQuery select标签操作代码段_jquery

下面几个常用的代码或许对您有帮助: 复制代码 代码如下: //1.获取选中option值 $('#selectList').val(); //2.获取选中option的文本 $('#selectList :selected').text(); //3.获取多个选中option值.文本 var foo = []; $('#multiple :selected').each(function(i, selected) { foo[i] = $(selected).text(); }); // to