<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>统计详情</title> <link href="/static/bootstrap/2.3.1/css_cerulean/bootstrap.css" rel="stylesheet" type="text/css" /> <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script> <script src="statistics_detail.js" type="text/javascript"></script> </head> <body> <ul class="nav nav-tabs"> <li class="active"><a href="">邮件统计</a></li> </ul> <table id="contentTable" class="table table-striped table-bordered table-condensed"> <thead> <tr> <th><input type="checkbox" id="all"/></th> <th>邮件名称</th> <th>发送状态</th> <th>收件人</th> </tr> </thead> <tbody id="data"></tbody> </table> <input type="button" class="btn btn-primary" id="btn" value="统计邮件" /> </body> </html>
statistics_detail.js
var obj = {}; obj.initTable = function(){ $.get("/email/statisticDetail",function(result){ var str = ""; if(result.length != 0){ for (var i = 0; i < result.length; i++) { str += "<tr>"; str += "<td><input type='checkbox' name='single' value='"+result[i].id+"' onclick='obj.checkSingle()' /></td>"; str += "<td>"+result[i].mailId+"</td>"; str += "<td>"+result[i].status+"</td>"; str += "<td>"+result[i].listCount+"</td>"; str += "</tr>"; } } $("#data").empty(); $("#data").append(str); }); }; /** * 全选或全不选 */ obj.checkAll = function(){ var isCheck = ""; if($("#all").attr('checked') == true){ isCheck = "checked"; } var inputs = document.getElementsByTagName("input"); for(var i = 0; i < inputs.length; i++) { if(inputs[i].type == "checkbox") { inputs[i].checked = isCheck; } } }; /** * 单选 */ obj.checkSingle = function(){ var count = 0; var inputs = $('input[name="single"]'); for(var i = 0; i < inputs.length; i++) { if(inputs[i].checked == true) { count ++; } } if(count == inputs.length) { $("#all").attr("checked", true); } else { $("#all").attr("checked", false); } }; obj.count = function(){ var array = new Array(); var inputs = $('input[name="single"]'); for(var i = 0; i < inputs.length; i++) { if(inputs[i].checked == true) { array.push(inputs[i].value); } } location.href = "statistics.html?ids=" + array; }; $(document).ready(function(){ obj.initTable(); $("#all").click(obj.checkAll); $("#btn").click(obj.count); });