JQuery一种取同级值的方式(比如你在GridView中)


Posted in Javascript onMarch 15, 2012
<asp:GridView ID="gvReceipt" runat="server" Width="100%" AutoGenerateColumns="False" DataKeyNames="ID" CssClass="Grid" > 
<Columns> 
<asp:TemplateField> 
<ItemTemplate > 
<input type="checkbox" id="chkReceipt" value='<%#Eval("ID") %>' name="chkReceipt" /> 
<input id="hdCustomerCode" type="hidden" value='<%#Eval("CustomerCode") %>' /> 
<input id="hdCustomerName" type="hidden" value='<%#Eval("Customer") %>' /> 
<input class="hdStatus" type="hidden" value='<%#Eval("Department") %>' /> 
</ItemTemplate> 
</asp:TemplateField> 
</asp:GridView>

你想取选中的checkbox后面隐藏域中的value,如下:
function SelectReceipt() 
{ 
var checknum = 0; 
var customerCode = ""; 
var type = ""; 
var url = ""; 
checknum = $("input:checked").length; 
if (checknum > 1) 
{ 
alert("只能选择一条记录进行收款!"); 
return false; 
} 
else 
{ 
alert(checknum); 
if (checknum == 1) 
{ 
customerCode = $("input:checked").next().attr("value"); //通过next()方法取,如果要取再下一个hdCustomerName的值,可以.next().next()。 
//customerName = $("input:checked~#hdCustomerName").val();//IE用ID会报错,firefox不会 
type = $("input:checked~.hdStatus").attr("value");//或者通过用class的方式取, 
url = 'PreReceiptDeposit.aspx?customerCode=' + customerCode + '&departmentType=' + type; 
} 
else 
{ 
url = 'PreReceiptDeposit.aspx?customerCode=' + '' + '&departmentType=' + type; 
} 
alert(url); 
UniversalOpenWindowAndBreak(640, 600, url, 1); 
return true; 
} 
}

jQuery--checkbox全选/取消全选
<html> 
<head> 
<script src="jquery-1.3.2.min.js" type="text/javascript"></script> 
</head> 
<body> 
<input type="checkbox" name="chk_list" id="chk_list_1" value="1" />1<br /> 
<input type="checkbox" name="chk_list" id="chk_list_2" value="2" />2<br /> 
<input type="checkbox" name="chk_list" id="chk_list_3" value="3" />3<br /> 
<input type="checkbox" name="chk_list" id="chk_list_4" value="4" />4<br /> 
<input type="checkbox" name="chk_all" id="chk_all" />全选/取消全选 
<script type="text/javascript"> 
$("#chk_all").click(function(){ 
$("input[name='chk_list']").attr("checked",$(this).attr("checked")); 
}); 
</script> 
</body> 
</html>

jQuery.attr 获取/设置对象的属性值,如:
$("input[name='chk_list']").attr("checked"); //读取所有name为'chk_list'对象的状态(是否选中)
$("input[name='chk_list']").attr("checked",true); //设置所有name为'chk_list'对象的checked为true
再如:
$("#img_1").attr("src","test.jpg"); //设置ID为img_1的<img>src的值为'test.jpg'
$("#img_1").attr("src"); //读取ID为img_1的<img>src值
下面的代码是获取上面实例中选中的checkbox的value值:
<script type="text/javascript"> 
//获取到所有name为'chk_list'并选中的checkbox(集合) 
var arrChk=$("input[name='chk_list]:checked"); 
//遍历得到每个checkbox的value值 
for (var i=0;i<arrChk.length;i++) 
{ 
alert(arrChk[i].value); 
} 
</script>

下面是用$.each()遍历的代码:
<script type="text/javascript"> 
var arrChk=$("input[name='chk_list']:checked"); 
$(arrChk).each(function(){ 
window.alert(this.value); 
}); 
}); 
</script>
Javascript 相关文章推荐
使用jQuery同时控制四张图片的伸缩实现代码
Apr 19 Javascript
jQuery动画效果-slideUp slideDown上下滑动示例代码
Aug 28 Javascript
JavaScript对内存分配及管理机制详细解析
Nov 11 Javascript
javascript html5移动端轻松实现文件上传
Mar 27 Javascript
JavaScript6 let 新语法优势介绍
Jul 15 Javascript
javaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序整理总结
Oct 10 Javascript
Vue2仿淘宝实现省市区三级联动
Apr 15 Javascript
浅谈vue自定义全局组件并通过全局方法 Vue.use() 使用该组件
Dec 07 Javascript
详解滑动穿透(锁body)终极探索
Apr 16 Javascript
vue基于Echarts的拖拽数据可视化功能实现
Dec 04 Vue.js
node中使用shell脚本的方法步骤
Mar 23 Javascript
原生JS中应该禁止出现的写法
May 05 Javascript
ASP.NET MVC中EasyUI的datagrid跨域调用实现代码
Mar 14 #Javascript
javascript 进阶篇3 Ajax 、JSON、 Prototype介绍
Mar 14 #Javascript
javascript 进阶篇2 CSS XML学习
Mar 14 #Javascript
javascript 进阶篇1 正则表达式,cookie管理,userData
Mar 14 #Javascript
javascript 基础篇4 window对象,DOM
Mar 14 #Javascript
javascript 基础篇3 类,回调函数,内置对象,事件处理
Mar 14 #Javascript
javascript 基础篇2 数据类型,语句,函数
Mar 14 #Javascript
You might like
php中使用接口实现工厂设计模式的代码
2012/06/17 PHP
推荐几款用 Sublime Text 开发 Laravel 所用到的插件
2014/10/30 PHP
PHP自定义多进制的方法
2016/11/03 PHP
详解PHP 二维数组排序保持键名不变
2019/03/06 PHP
PHP中str_split()函数的用法讲解
2019/04/11 PHP
Laravel框架下载,安装及路由操作图文详解
2019/12/04 PHP
js脚本学习 比较实用的基础
2006/09/07 Javascript
模仿jQuery each函数的链式调用
2009/07/22 Javascript
LazyLoad 延迟加载(按需加载)
2010/05/31 Javascript
基于Jquery实现表格动态分页实现代码
2011/06/21 Javascript
JQuery防止退格键网页后退的实现代码
2012/03/23 Javascript
javascript作用域和闭包使用详解
2014/04/25 Javascript
javascript动态创建及删除元素的方法
2014/12/22 Javascript
JavaScript DSL 流畅接口(使用链式调用)实例
2015/03/15 Javascript
jQuery生成假加载动画效果
2016/12/01 Javascript
vue组件编写之todolist组件实例详解
2018/01/22 Javascript
Angular 向组件传递模板的两种方法
2018/02/23 Javascript
vue2.0 element-ui中el-select选择器无法显示选中的内容(解决方法)
2018/08/24 Javascript
详解vuex持久化插件解决浏览器刷新数据消失问题
2019/04/15 Javascript
js动态生成表格(节点操作)
2021/01/12 Javascript
python操作CouchDB的方法
2014/10/08 Python
python字典基本操作实例分析
2015/07/11 Python
Python实现针对中文排序的方法
2017/05/09 Python
Python3匿名函数用法示例
2018/07/25 Python
python二维码操作:对QRCode和MyQR入门详解
2019/06/24 Python
python 基于TCP协议的套接字编程详解
2019/06/29 Python
python创建学生成绩管理系统
2019/11/22 Python
详细分析Python可变对象和不可变对象
2020/07/09 Python
关于HTML5+ API plusready的兼容问题
2020/11/20 HTML / CSS
波兰品牌内衣及泳装网上商店:Astratex.pl
2017/02/03 全球购物
美国婚戒购物网站:Anjays Designs
2017/06/28 全球购物
自荐信的基本格式
2014/02/22 职场文书
2014年幼师工作总结
2014/11/22 职场文书
开国大典观后感
2015/06/04 职场文书
远程教育学习心得体会
2016/01/23 职场文书
致男子1500米运动员的广播稿
2019/11/08 职场文书