Jquery全选单选功能
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm6.aspx.cs" Inherits="wzgyd.WebForm5" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>无标题页</title>
<link href="Stylesheet1.css" rel="Stylesheet" type="text/css" />
<script src="js/jquery-1.8.3.js" type="text/javascript"></script>
<script type="text/javascript">
/*checked全选*/
function clickAll(){
if ($("#Check0").attr("checked")) {
$("input[name='check']").attr("checked", true);
$(".body1").css("background-color","#92c0f1");
}else {
$("input[name='check']").attr("checked", false);
$(".body1").css("background-color","#ffffff");
}
}
/*checked全选*/
function clickAll2(){
if ($("#Check4").attr("checked")) {
$(".body1").css("background-color","#92c0f1");
$("input[name='check']").attr("checked", true);
}else {
$(".body1").css("background-color","#ffffff");
$("input[name='check']").attr("checked", false);
}
}
//注册checkbox的click事件
$(document).on('click', ':checkbox', function (e) {
//停止事件冒泡,当点击的是checkbox时,就不执行父div的click
e.stopPropagation();
var oCk = $(this), parentDiv = oCk.parent().parent();
//oCk.prop('checked') ? parentDiv.css('background-color', '#fff4e8') : parentDiv.css('background-color', '');
if(oCk.prop('checked')){
parentDiv.css('background-color', '#92c0f1')
}else{
parentDiv.css('background-color', '');
$("#Check0,#Check4").attr("checked",false);
}
});
</script>
</head>
<body id="table2">
<form id="form1" runat="server">
<div style="height: auto; width:990px; color:Gray; border:0px; border:solid 0.2px #f0f0f0; font-family:微软雅黑;">
<%-- <div style=" width:200px; height: 728px; float:left;border:solid 0.2px #f0f0f0;"></div>--%>
<div style=" margin-left:20px; width:990px; height: 726px; float:left; margin-left:8px; ">
<div style="height: 28px;">
<div class="head0" style="margin-left:20px; color:Black;">选择需求计划</div>
<div style=" float:right;"><a href="#"><<</a> 1/3 <a href="#">>></a></div>
</div>
<div style=" height:14px;"></div>
<div class="body0">
<div style="float:left;"><input type="checkbox" id="Check0" name="check" onclick="clickAll()" />全选</div>
<div style="width:40px; float:left; height:43px;"></div>
<div style="width: 50px; float:left;">计划编号</div>
<div style="width:269px; float:left; height:43px;"></div>
<div style="width: 51px; float:left;">计划名称</div>
<div style="width:295px; float:left; height:43px;"></div>
<div style="width: 55px; float:left;">录入日期</div>
</div>
<div><hr /></div>
<div style="height:35px;"></div>
<div class="body1">
<div class="body2"><div class="body2" style="height:9px;"></div><input type="checkbox" id="check1" name="check" /></div>
<div class="body3"></div>
<div class="body5">11252512</div>
<div class="body6"></div>
<div class="body7">XX计划</div>
<div class="body8">
</div>
<div class="body10">2015-8-9</div>
<div class="body11">
<div class="body18"></div>
<div>物资明细</div>
</div>
</div>
<div class="body12"></div>
<div class="body13"></div>
<div class="body1">
<div class="body2"><div class="body2" style="height:9px;"></div><input type="checkbox" id="Checkbox1" name="check" /></div>
<div class="body3"></div>
<div class="body5">11252512</div>
<div class="body6"></div>
<div class="body7">XX计划</div>
<div class="body8">
</div>
<div class="body10">2015-8-9</div>
<div class="body11">
<div class="body18"></div>
<div>物资明细</div>
</div>
</div>
<div class="body12"></div>
<div class="body13"></div>
<%-- <div class="body14">
<div class="body15">
<input type="checkbox" id="Check4" name="check" onclick="clickAll2()" />全选
</div>
<div class="body16">删除选中商品</div>
<div class="body16">移到我的关注</div>
<div style="width: 76px; height:53px;float:left;"></div>
<div style="width: 197px; height:53px;float:left;">
<div style="width: 170px; float:left;">总价(不含运费):666.00元</div>
<div style="width: 169px; float:left;">已节省:100.00元</div>
</div>
<div class="body17">去结算</div>
</div>--%>
</div>
</div>
</form>
</body>
</html>
最新文章
- vertx核心类之VertxImpl
- struts2.0整合json
- oracle 之 函数
- Arduino单片机使用和开发问题记录
- Spring Autowiring by Name
- C# 正则表达式 学习笔记二
- iOS中的几种定时器详解
- JQuery EasyUI 对话框的使用方法
- CMake使用之一
- wifi驱动总结（2）
- 图片压缩上传Thumbnailator 插件
- SQLite 语法(http://www.w3cschool.cc/sqlite/sqlite-syntax.html)
- Scrapy框架-----爬虫
- 最全面的Redis命令行查阅手册（收藏查看）
- Your CPU supports instructions that this TensorFlow binary was not compiled to use: AVX2
- 使用Topshelf开发Windows服务、log4net记录日志
- ASP.NET WebAPI数据传输安全HTTPS实战项目演练
- Unity3D 导入aar注意事项
- Tsung 超详细的的tsung性能测试资料
- (后端)Java新人入职——配置环境及安装开发工具（完全）