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实现的移入页面上空文本框时,让它变为焦点,移出清除焦点
Jul 26 Javascript
自己实现ajax封装示例分享
Apr 01 Javascript
JS中处理时间之setUTCMinutes()方法的使用
Jun 12 Javascript
动态创建按钮的JavaScript代码
Jan 29 Javascript
jquery根据td给相同tr下其他td赋值的实现方法
Oct 05 Javascript
jquery+ajax实现省市区三级联动效果简单示例
Jan 04 Javascript
vue2.0使用Sortable.js实现的拖拽功能示例
Feb 21 Javascript
AngularJS下$http服务Post方法传递json参数的实例
Mar 29 Javascript
详解Vue Cli浏览器兼容性实践
Jun 08 Javascript
解决vue的touchStart事件及click事件冲突问题
Jul 21 Javascript
vue flex 布局实现div均分自动换行的示例代码
Aug 05 Javascript
JS异步宏队列微队列原理详解
Sep 09 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面向对象的方法重载两种版本比较
2008/09/08 PHP
PHP脚本监控Nginx 502错误并自动重启php-fpm
2015/05/13 PHP
Tab页界面,用jQuery及Ajax技术实现
2009/09/21 Javascript
jquery在Chrome下获取图片的长宽问题解决
2013/03/20 Javascript
JAVASCRIPT函数作用域和提前声明 分享
2013/08/22 Javascript
Jquery中给animation加更多的运作效果实例
2013/09/05 Javascript
jquery.uploadify插件在chrome浏览器频繁崩溃解决方法
2015/03/01 Javascript
jquery 获取select数组与name数组长度的实现代码
2016/06/20 Javascript
详解jQuery的表单验证插件--Validation
2016/12/21 Javascript
解决nodejs中使用http请求返回值为html时乱码的问题
2017/02/18 NodeJs
jQuery实现可兼容IE6的淡入淡出效果告警提示功能示例
2017/09/20 jQuery
搭建element-ui的Vue前端工程操作实例
2018/02/23 Javascript
Vue实现6位数密码效果
2018/08/18 Javascript
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
2018/08/24 Javascript
JS实现返回上一页并刷新页面的方法分析
2019/07/16 Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
2019/09/16 Javascript
微信小程序实现点击页面出现文字
2020/09/21 Javascript
详解Vue中Axios封装API接口的思路及方法
2020/10/10 Javascript
python中enumerate函数用法实例分析
2015/05/20 Python
python画出三角形外接圆和内切圆的方法
2018/01/25 Python
python如何通过实例方法名字调用方法
2018/03/21 Python
Python中利用xpath解析HTML的方法
2018/05/14 Python
python操作mysql代码总结
2018/06/01 Python
Flask框架路由和视图用法实例分析
2019/11/07 Python
python实现将json多行数据传入到mysql中使用
2019/12/31 Python
HTML5学习笔记之History API
2015/02/26 HTML / CSS
法拉利英国精品店:Ferraris Boutique UK
2019/07/20 全球购物
微软马来西亚官方网站:Microsoft马来西亚
2019/11/22 全球购物
世界上最好的野生海鲜和有机食品:Vital Choice
2020/01/16 全球购物
C#里面可以避免一个类被其他类继承么?如何?
2013/09/26 面试题
Java面试题:Java类的Main方法如果是Private将会怎么样
2016/08/18 面试题
考生诚信考试承诺书
2014/05/23 职场文书
诚信贷款承诺书
2014/05/30 职场文书
开学第一周值周总结
2015/07/16 职场文书
JavaScript阻止事件冒泡的方法
2021/12/06 Javascript
PO模式在selenium自动化测试框架的优势
2022/03/20 Python