javascript获得CheckBoxList选中的数量


Posted in Javascript onOctober 27, 2009

jQuery的选择器真的好强大,好灵活。 javascript的原始方法也值得研究。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="CheckBoxList.aspx.cs" Inherits="CheckBoxList" %> 
<!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>获得CheckBoxList选中的数量(jQuery与Javascript对照学习/前台与后台)</title> 
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> 
<script type="text/javascript"> 
//jQuery的方法(王君) 
$(function(){ 
$("#chkBox").click(function(){ 
alert($("#chkBox input[@type=checkbox]:checked").size()); 
}); 
}); 
//javacript方法(候林) 
function f(){ 
var a=document.getElementsByTagName('input') 
var num=0; 
for(var i=0;i<a.length;i++){ 
if(a[i].type=='checkbox'){ 
if(a[i].checked==true) 
num+=1; 
} 
} 
alert(num); 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div> 
jQuery的选择器真的好强大,好灵活。<br /> 
javascript的原始方法也值得研究。 
</div> 
<div> 
<input type="button" value="Javascript取值" onclick="f();" /> 
<asp:CheckBoxList ID="chkBox" runat="server"> 
<asp:ListItem>1</asp:ListItem> 
<asp:ListItem>2</asp:ListItem> 
<asp:ListItem>3</asp:ListItem> 
</asp:CheckBoxList> 
<asp:Button ID="btnOk" runat="server" OnClick="btnOk_Click" Text="服务器端取" /> 
</div> 
</form> 
</body> 
</html>
using System; 
using System.Data; 
using System.Configuration; 
using System.Collections; 
using System.Web; 
using System.Web.Security; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using System.Web.UI.WebControls.WebParts; 
using System.Web.UI.HtmlControls; 
public partial class CheckBoxList : System.Web.UI.Page 
{ 
protected void Page_Load(object sender, EventArgs e) 
{ 
} 
protected void btnOk_Click(object sender, EventArgs e) 
{ 
int totalNum = 0;//总数 
string list = "000";//选中的值 
for (int i = 0; i < this.chkBox.Items.Count; i++) 
{ 
if (chkBox.Items[i].Selected) 
{ 
totalNum += 1; 
list += "," + chkBox.Items[i].Value; 
} 
} 
Response.Write(totalNum.ToString() + "|" + list); 
} 
}
Javascript 相关文章推荐
JavaScript的9个陷阱及评点分析
May 16 Javascript
jQuery的缓存机制浅析
Jun 07 Javascript
JQuery分屏指示器图片轮换效果实例
May 21 Javascript
JS禁用页面上所有控件的实现方法(附demo源码下载)
Dec 17 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
Apr 29 Javascript
基于jQuery实现数字滚动效果
Jan 16 Javascript
vue登录路由验证的实现
Dec 13 Javascript
Layer+Echarts构建弹出层折线图的方法
Sep 25 Javascript
小程序双头slider选择器的实现示例
Mar 31 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 Javascript
Antd的table组件表格的序号自增操作
Oct 27 Javascript
Ajax实现异步加载数据
Nov 17 Javascript
基于jQuery的日期选择控件
html 锁定页面(js遮罩层弹出div效果)
Oct 27 #Javascript
javascript 读取XML数据,在页面中展现、编辑、保存的实现
Oct 27 #Javascript
Ajax+Json 级联菜单实现代码
Oct 27 #Javascript
javascript 关于# 和 void的区别分析
Oct 26 #Javascript
用Greasemonkey 脚本收藏网站会员信息到本地
Oct 26 #Javascript
解决jquery .ajax 在IE下卡死问题的解决方法
Oct 26 #Javascript
You might like
php 将bmp图片转为jpg等其他任意格式的图片
2009/06/21 PHP
PHP获取photoshop写入图片文字信息的方法
2015/03/31 PHP
curl和libcurl的区别简介
2015/07/01 PHP
详解thinkphp中的volist标签
2018/01/15 PHP
JavaScript中各种编码解码函数的区别和注意事项
2010/08/19 Javascript
JS 如果改变span标签的是否隐藏属性
2011/10/06 Javascript
JavaScript中innerHTML,innerText,outerHTML的用法及区别
2015/09/01 Javascript
JavaScript操作HTML元素和样式的方法详解
2015/10/21 Javascript
详解Vue-cli 创建的项目如何跨域请求
2017/05/18 Javascript
Bootstrap-table自定义可编辑每页显示记录数
2018/09/07 Javascript
JavaScript实现shuffle数组洗牌操作示例
2019/01/03 Javascript
JavaScript中关于base64的一些事
2019/05/06 Javascript
vue实现固定位置显示功能
2019/05/30 Javascript
js getBoundingClientRect使用方法详解
2019/07/17 Javascript
jQuery实现简易聊天框
2020/02/08 jQuery
[33:17]OG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
使用 Python 获取 Linux 系统信息的代码
2014/07/13 Python
python中文编码问题小结
2014/09/28 Python
KMP算法精解及其Python版的代码示例
2016/06/01 Python
Python WEB应用部署的实现方法
2019/01/02 Python
python使用正则筛选信用卡
2019/01/27 Python
Python中遍历列表的方法总结
2019/06/27 Python
python 搜索大文件的实例代码
2019/07/08 Python
如何爬取通过ajax加载数据的网站
2019/08/15 Python
python打印直角三角形与等腰三角形实例代码
2019/10/20 Python
Anaconda和ipython环境适配的实现
2020/04/22 Python
通过cmd进入python的步骤
2020/06/16 Python
Python 合并拼接字符串的方法
2020/07/28 Python
Opencv 图片的OCR识别的实战示例
2021/03/02 Python
财务会计自荐信范文
2014/02/21 职场文书
2014年计生协会工作总结
2014/11/21 职场文书
2015年高考寄语或鼓励的话
2015/03/23 职场文书
个人廉政承诺书
2015/04/28 职场文书
大学宣传委员竞选稿
2015/11/19 职场文书
解决pycharm安装scrapy DLL load failed:找不到指定的程序的问题
2021/06/08 Python
VS2019连接MySQL数据库的过程及常见问题总结
2021/11/27 MySQL