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 相关文章推荐
Html中JS脚本执行顺序简单举例说明
Jun 19 Javascript
JavaScript的常见兼容问题及相关解决方法(chrome/IE/firefox)
Dec 31 Javascript
json中换行符的处理方法示例介绍
Jun 10 Javascript
ES6学习笔记之Set和Map数据结构详解
Apr 07 Javascript
JS表格组件神器bootstrap table使用指南详解
Apr 12 Javascript
JS基于开关思想实现的数组去重功能【案例】
Feb 18 Javascript
js如何获取图片url的Blob值并预览示例代码
Mar 07 Javascript
详解使用React制作一个模态框
Mar 14 Javascript
JS正则表达式封装与使用操作示例
May 15 Javascript
vue 实现滚动到底部翻页效果(pc端)
Jul 31 Javascript
JS实现TITLE悬停长久显示效果完整示例
Feb 11 Javascript
Vue常用的全选/反选的示例代码
Feb 19 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
从网上搜到的phpwind 0day的代码
2006/12/07 PHP
PHP分页显示制作详细讲解
2008/11/19 PHP
php使用GeoIP库实例
2014/06/27 PHP
php递归遍历多维数组的方法
2015/04/18 PHP
PHP函数nl2br()与自定义函数nl2p()换行用法分析
2016/04/02 PHP
thinkphp3.x连接mysql数据库的方法(具体操作步骤)
2016/05/19 PHP
解决AJAX中跨域访问出现'没有权限'的错误
2008/08/20 Javascript
jQuery 开天辟地入门篇一
2009/12/09 Javascript
Bootstrap实现默认导航栏效果
2020/09/21 Javascript
jQuery回到顶部的代码
2016/07/09 Javascript
js中json处理总结之JSON.parse
2016/10/14 Javascript
bootstrap table小案例
2016/10/21 Javascript
Extjs gridpanel 中的checkbox(复选框)根据某行的条件不能选中的解决方法
2017/02/17 Javascript
js图片放大镜效果实现方法详解
2020/10/28 Javascript
jQuery 实现左右两侧菜单添加、移除功能
2018/01/02 jQuery
JavaScript满天星导航栏实现方法
2018/03/08 Javascript
Vue.js点击切换按钮改变内容的实例讲解
2018/08/22 Javascript
Node.js实现批量下载图片简单操作示例
2020/01/18 Javascript
[00:23]DOTA2群星共贺开放测试 25日无码时代来袭
2013/09/23 DOTA
wxPython实现整点报时
2019/11/18 Python
Python 元组拆包示例(Tuple Unpacking)
2019/12/24 Python
django自定义非主键自增字段类型详解(auto increment field)
2020/03/30 Python
python小白切忌乱用表达式
2020/05/29 Python
Anaconda+spyder+pycharm的pytorch配置详解(GPU)
2020/10/18 Python
咖啡为什么会有酸味?你喝到的咖啡為什麼是酸的?
2021/03/17 冲泡冲煮
印度尼西亚最大和最全面的网络商城:Blibli.com
2017/10/04 全球购物
波兰补充商店:Muscle Power
2018/10/29 全球购物
澳大利亚网上买书:Angus & Robertson
2019/07/21 全球购物
精彩自我鉴定
2014/01/16 职场文书
环保公益策划方案
2014/08/15 职场文书
党员教师个人对照检查材料范文
2014/09/25 职场文书
派出所正风肃纪剖析材料
2014/10/10 职场文书
小学班主任个人总结
2015/03/03 职场文书
2016年万圣节活动总结
2016/04/05 职场文书
MIME类型中application/xml与text/xml的区别介绍
2022/01/18 HTML / CSS
SpringBoot详解自定义Stater的应用
2022/07/15 Java/Android