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 相关文章推荐
CSS JavaScript 实现菜单功能 改进版
Dec 09 Javascript
打开新窗口关闭当前页面不弹出关闭提示js代码
Mar 18 Javascript
js弹出层永远居中实现思路及代码
Nov 29 Javascript
js二维数组排序的简单示例代码
Jan 24 Javascript
使用JQuery实现Ctrl+Enter提交表单的方法
Oct 22 Javascript
jQuery实现的左右移动焦点图效果
Jan 14 Javascript
微信小程序 地图定位简单实例
Oct 14 Javascript
bootstrap学习使用(导航条、下拉菜单、轮播、栅格布局等)
Dec 01 Javascript
在一个页面重复使用一个js函数的方法详解
Dec 26 Javascript
Web前端框架bootstrap实战【第一次接触使用】
Dec 28 Javascript
JavaScript闭包的简单应用
Sep 01 Javascript
基于element-ui对话框el-dialog初始化的校验问题解决
Sep 11 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
支付宝服务窗API接口开发php版本
2016/07/20 PHP
php 替换文章中的图片路径,下载图片到本地服务器的方法
2018/02/06 PHP
JavaScript 对象的属性和方法4种不同的类型
2010/03/19 Javascript
JS上传前预览图片实例
2013/03/25 Javascript
使用jQuery UI的tooltip函数修饰title属性的气泡悬浮框
2013/06/24 Javascript
JQuery each打印JS对象的方法
2013/11/13 Javascript
javascript弹出拖动窗口
2015/08/11 Javascript
js实现图片上传并正常显示
2015/12/19 Javascript
jQuery中通过ajax的get()函数读取页面的方法
2016/02/29 Javascript
javascript获取网页各种高宽及位置的方法总结
2016/07/27 Javascript
BootStrap的table表头固定tbody滚动的实例代码
2016/08/24 Javascript
IOS中safari下的select下拉菜单文字过长不换行的解决方法
2016/09/26 Javascript
React BootStrap用户体验框架快速上手
2018/03/06 Javascript
深入理解JS中Number(),parseInt(),parseFloat()三者比较
2018/08/24 Javascript
vue实现鼠标移入移出事件代码实例
2019/03/27 Javascript
Vue监听页面刷新和关闭功能
2019/06/20 Javascript
vue动态禁用控件绑定disable的例子
2019/10/28 Javascript
ES6 Object.assign()的用法及其使用
2020/01/18 Javascript
vue全屏事件开发详解
2020/06/17 Javascript
selenium 反爬虫之跳过淘宝滑块验证功能的实现代码
2020/08/27 Javascript
ES5和ES6中类的区别总结
2020/12/21 Javascript
Python中collections模块的基本使用教程
2018/12/07 Python
Pycharm之快速定位到某行快捷键的方法
2019/01/20 Python
Python Django给admin添加Action的方法实例详解
2019/04/29 Python
python中的&amp;&amp;及||的实现示例
2019/08/07 Python
python3.6生成器yield用法实例分析
2019/08/23 Python
以下为Windows NT 下的32 位C++程序,请计算sizeof 的值
2016/12/07 面试题
优秀幼教自荐信
2014/02/03 职场文书
公益活动邀请函
2014/02/05 职场文书
护士毕业自我鉴定
2014/02/07 职场文书
采购意向书范本
2014/03/31 职场文书
教师求职信
2014/06/17 职场文书
优秀班集体申报材料
2014/12/25 职场文书
初中语文教学研修日志
2015/11/13 职场文书
2016年学生会感恩节活动总结
2016/04/01 职场文书
nginx配置proxy_pass中url末尾带/与不带/的区别详解
2021/03/31 Servers