Jquery选中行实现行中的Checkbox的选中与取消选中
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(function () {
$("input[type=checkbox]").on("click", function (e) {
e.stopPropagation();//阻止冒泡
$("#info tr").each(function () {
if ($(this).find("input[type=checkbox]").is(":checked")) {
$(this).css("background-color", "pink");
}
else {
$(this).css("background-color", "");
}
})
})
$("#info").find("tr").click(function () {
var checkbox = $(this).find("input[type=checkbox]");
if (checkbox.is(":checked")) {
checkbox.prop("checked", false);
$(this).css("background-color", "");
} else {
checkbox.prop("checked", true);
$(this).css("background-color", "pink");
}
})
})
</script>
<style type="text/css">
table {
border-collapse: collapse;
} table tr td {
border: 1px solid red;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table id="info">
<tr>
<td style="width: 40px;">选择</td>
<td>用户名</td>
<td>密码</td>
<td>备注</td>
</tr>
<tr>
<td>
<asp:CheckBox ID="CheckBox1" runat="server" /></td>
<td>张三</td>
<td>123</td>
<td>喝完了酒两位咯危机or叫我阿胶尾盘快速扩散的扑克牌上看到佛山恐怕文凭</td>
</tr>
<tr>
<td>
<asp:CheckBox ID="CheckBox2" runat="server" /></td>
<td>张三</td>
<td>123</td>
<td>喝完了酒两位咯危机or叫我阿胶尾盘快速扩散的扑克牌上看到佛山恐怕文凭</td>
<tr>
<td>
<asp:CheckBox ID="CheckBox3" runat="server" /></td>
<td>张三</td>
<td>123</td>
<td>喝完了酒两位咯危机or叫我阿胶尾盘快速扩散的扑克牌上看到佛山恐怕文凭</td>
</tr>
<tr>
<td>
<asp:CheckBox ID="CheckBox4" runat="server" /></td>
<td>张三</td>
<td>123</td>
<td>喝完了酒两位咯危机or叫我阿胶尾盘快速扩散的扑克牌上看到佛山恐怕文凭</td>
</tr>
<tr>
<td>
<asp:CheckBox ID="CheckBox5" runat="server" /></td>
<td>张三</td>
<td>123</td>
<td>喝完了酒两位咯危机or叫我阿胶尾盘快速扩散的扑克牌上看到佛山恐怕文凭</td>
</tr>
</tr>
</table>
</div>
</form>
</body>
</html>
Jquery选中行实现行中的Checkbox的选中与取消选中的更多相关文章
- JQuery获取指定元素中的checkbox选中状态的一些属性
项目中用户上传病例数据,每一次上传自动生成一个病例文件夹,数据保存到后台,前端显示文件夹,现在的需求是勾选想要删除的文件夹的chenckbox,点击删除后,数据库和前端都相应的更新. 如果是静态页面, ...
- Jquery动态在td中添加checkbox
如图:想要在这个id为headId的<td>中,用jquery动态添加checkbox 代码如下 : data是我用ajax 从后台获取的数据,里面含有若干个user类,我想把所有的人名字 ...
- freemarker中修改和添加功能中包含checkbox复选框默认选中需求的解决方式
今天做的公司ERP系统上线第一天内部使用的,各种BUG铺天盖地,[虽然只是技术总监一个人在测试……],其中有一个就是其中部门管理页面中的修改和添加功能 一个人做一套ERP总是有点疏漏的,虽然里面的东西 ...
- easyui 上 datagrid 的表头的checkbox全选时 取消选中 disabled的checkbox
业务需求: 正常情况下,easyui的全选checkbox会选择表中全部的checkbox包括行.及时对checkbox加了disable属性也没有效果.但是现在的业务是当对checkbox加了dis ...
- jQuery EasyUI DataGrid API 中文文档
扩展自$.fn.panel.defaults,用 $.fn.datagrid.defaults重写了 defaults . 依赖 panel resizable linkbutton pagi ...
- easyui中带checkbox框的tree
var data = [{ "id": 1, "checked":true, "text": "系统菜单", " ...
- Jquery中的checkbox 及radio的问题
在web开发中,我们经常会对checkbox和radio进行读写操作,下面我来分享一下我的项目中的相关案例: 一.checkbox <input id="check1" cl ...
- jQuery中的checkbox问题
一开始的代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- jquery获取复选框(checkbox)的选中值(一组和单个)
使用jquery获取一组或者单个checkbox的选中状态的值.下面通过一个示例进行说明,假设现有一页面有一组checkbox的name的值为id,那么获取这组name=id的checkbox的值的方 ...
随机推荐
- 关于QString::toWCharArray 无法解析的外部符号
1>CommManger.obj : error LNK2019: 无法解析的外部符号 "public: int __thiscall QString::toWCharArray(un ...
- html 图像映射
个人先做而一个例子 <body> <img src="图像映射/enterdesk.com-D69055E2B422567CB273963EA05FF7D4.jpg&quo ...
- Ubuntu 14 如何打开 .chm格式文档?
好多手册是.chm格式,Ubuntu是需要安装第三方软件才能打开.chm格式文档,操作方式如下: 到“软件中心” -> 搜索“xchm”,并安装 -> 右键某个.chm文档,选择“属性” ...
- php 调用系统命令
system 与 exec 两者区别与联系:都会返回最后一行,命令执行成功的return返回值, 区别:system直接将输出内容echo出来,而exec将每一行输出内容保存到数组$output里. ...
- springmvc之前后台传值
一.向后台传值 1.项目结构 2.jar包 3.spring-config.xml <?xml version="1.0" encoding="UTF-8" ...
- Bootstrap编码规范
黄金定律 永远遵循同一套编码规范 -- 可以是这里列出的,也可以是你自己总结的.如果你发现本规范中有任何错误,敬请指正.通过 open an issue on GitHub为本规范添加或贡献内容. 不 ...
- MAC地址,使用java获取IP地址和MAC地址。
MAC地址,通常在http连接的项目中,来区分唯一客户端. MAC:六组十六进制字符组成. 如:E0-3F-49-AB-DB-EB IP:四组八位的二进制字符组成. 如:10.6.62.244 /** ...
- nginx反向代理后getRequestURL会出现问题
nginx反向代理后getRequestURL会出现问题 http://huangqiqing123.iteye.com/blog/1895192
- Android 数据存储之 SQLite数据库存储
----------------------------------------SQLite数据库---------------------------------------------- SQLi ...
- Qt 官方一键动态发布技能
苦找了好几天动态库,程序可以运行了,结果没有图标还是少了运行库很苦恼,发现Qt 官方有一键动态发布功能感觉自己萌萌的,来自qt吧亲测可用. 集成开发环境 QtCreator 目前生成图形界面程序 ex ...