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 相关文章推荐
用JS做的简单的可折叠的两级树形菜单
Sep 21 Javascript
点击页面其它地方隐藏该div的两种思路
Nov 18 Javascript
js实现类似新浪微博首页内容渐显效果的方法
Apr 10 Javascript
javascript原始值和对象引用实例分析
Apr 25 Javascript
两种JavaScript的AES加密方式(可与Java相互加解密)
Aug 02 Javascript
深入学习js瀑布流布局
Oct 14 Javascript
几种tab切换详解
Feb 03 Javascript
纯js三维数组实现三级联动效果
Feb 07 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
Apr 27 Javascript
详解JavaScript中关于this指向的4种情况
Apr 18 Javascript
微信小程序如何访问公众号文章
Jul 08 Javascript
微信小程序自定义弹出层效果
May 26 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多线程批量采集下载美女图片的实现代码(续)
2013/06/03 PHP
关于Sphinx创建全文检索的索引介绍
2013/06/25 PHP
php在数据库抽象层简单使用PDO的方法
2015/11/03 PHP
Linux下从零开始安装配置Nginx服务器+PHP开发环境
2015/12/21 PHP
php判断用户是否关注微信公众号
2016/07/22 PHP
Javascript 写的简单进度条控件
2008/01/22 Javascript
一段批量给页面上的控件赋值js
2010/06/19 Javascript
JS匀速运动演示示例代码
2013/11/26 Javascript
JS 操作Array数组的方法及属性实例解析
2014/01/08 Javascript
JS 日期比较大小的简单实例
2014/01/13 Javascript
解决自定义$(id)的方法与jquery选择器$冲突的问题
2014/06/14 Javascript
使用ajaxfileupload.js实现ajax上传文件php版
2014/06/26 Javascript
详解javascript函数的参数
2015/11/10 Javascript
jquery mobile 移动web(5)
2015/12/20 Javascript
jQuery获取this当前对象子元素对象的方法
2016/11/29 Javascript
微信小程序图片横向左右滑动案例
2017/05/19 Javascript
原生JS实现小小的音乐播放器
2017/10/16 Javascript
Angular2学习笔记之数据绑定的示例代码
2018/01/03 Javascript
vue-cli+iview项目打包上线之后图标不显示问题及解决方法
2019/10/16 Javascript
js this 绑定机制深入详解
2020/04/30 Javascript
使用python在校内发人人网状态(人人网看状态)
2014/02/19 Python
Python标准库urllib2的一些使用细节总结
2015/03/16 Python
python基于pygame实现响应游戏中事件的方法(附源码)
2015/11/11 Python
Python中单例模式总结
2018/02/20 Python
对python中的for循环和range内置函数详解
2018/04/17 Python
python实现简单淘宝秒杀功能
2018/05/03 Python
VPS CENTOS 上配置python,mysql,nginx,uwsgi,django的方法详解
2019/07/01 Python
使用APScheduler3.0.1 实现定时任务的方法
2019/07/22 Python
解决Python设置函数调用超时,进程卡住的问题
2019/08/08 Python
python中如何实现将数据分成训练集与测试集的方法
2019/09/13 Python
python调用jenkinsAPI构建jenkins,并传递参数的示例
2020/12/09 Python
捷克钓鱼用品网上商店:Parys.cz
2018/06/15 全球购物
Marc O’Polo俄罗斯官方在线商店:德国高端时尚品牌
2019/12/26 全球购物
意大利运动服减价商店:ScontoSport
2020/03/10 全球购物
2014两会学习心得:时代的发展
2014/03/17 职场文书
班干部学习委员竞选稿
2015/11/20 职场文书