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 相关文章推荐
Mootools 1.2教程 同时进行多个形变动画
Sep 15 Javascript
js操作二级联动实现代码
Jul 27 Javascript
Extjs EditorGridPanel中ComboBox列的显示问题
Jul 04 Javascript
jqgrid 编辑添加功能详细解析
Nov 08 Javascript
jQuery中:selected选择器用法实例
Jan 04 Javascript
JavaScript实现的类字典插入或更新方法实例
Jul 10 Javascript
详谈Node.js之操作文件系统
Aug 29 Javascript
jQuery实现的粘性滚动导航栏效果实例【附源码下载】
Oct 19 jQuery
JS实现的tab切换并显示相应内容模块功能示例
Aug 03 Javascript
layui表格数据复选框回显设置方法
Sep 13 Javascript
jquery实现直播视频弹幕效果
Feb 25 jQuery
javascript实现前端分页效果
Jun 24 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仿ZOL分页类代码
2008/10/02 PHP
针对多用户实现头像上传功能PHP代码 适用于登陆页面制作
2016/08/17 PHP
PHP生成短网址的思路以及实现方法的详解
2019/03/25 PHP
利用JQuery+EasyDrag 实现弹出可拖动的Div,同时向Div传值,然后返回Div选中的值
2009/10/24 Javascript
JavaScript 变量基础知识
2009/11/07 Javascript
IE不支持getElementsByClassName最终完美解决方案
2012/12/17 Javascript
js创建对象的区别示例介绍
2014/07/24 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
2016/05/03 Javascript
JavaScript获取当前url根目录(路径)
2016/06/17 Javascript
深入浅析javascript中的作用域(推荐)
2016/07/19 Javascript
JCrop+ajaxUpload 图像切割上传的实例代码
2016/07/20 Javascript
原生JS简单实现ajax的方法示例
2016/11/29 Javascript
jQuery Form插件使用详解_动力节点Java学院整理
2017/07/17 jQuery
JavaScript 值类型和引用类型的初次研究(推荐)
2017/07/19 Javascript
Vue中的slot使用插槽分发内容的方法
2018/03/01 Javascript
小程序自定义日历效果
2018/12/29 Javascript
微信小程序mpvue点击按钮获取button值的方法
2019/05/29 Javascript
layui 实现table翻页滚动条位置保持不变的例子
2019/09/05 Javascript
vue项目打包之开发环境和部署环境的实现
2020/04/23 Javascript
Vue检测屏幕变化来改变不同的charts样式实例
2020/10/26 Javascript
[03:26]回顾2015国际邀请赛中国区预选赛
2015/06/09 DOTA
在GitHub Pages上使用Pelican搭建博客的教程
2015/04/25 Python
Python实现个人微信号自动监控告警的示例
2019/07/03 Python
基于pandas中expand的作用详解
2019/12/17 Python
HTML5全屏(Fullscreen)API详细介绍
2015/04/24 HTML / CSS
乐天旅游香港网站:日本饭店预订
2017/11/29 全球购物
意大利在线购买隐形眼镜网站:VisionDirect.it
2019/03/18 全球购物
怎样声明一个匿名的内部类
2016/06/01 面试题
演讲稿格式
2014/04/30 职场文书
小学生春游活动方案
2014/08/20 职场文书
数学考试作弊检讨书300字
2015/02/16 职场文书
你离财务总监还有多远?速览CFO的岗位职责
2019/11/18 职场文书
「月刊Comic Alive」2022年5月号封面公开
2022/03/21 日漫
docker-compose部署Yapi的方法
2022/04/08 Servers
Nginx配置根据url参数重定向
2022/04/11 Servers
Python可视化神器pyecharts之绘制箱形图
2022/07/07 Python