以下是整个js内容
直接在HTML页面中引用就可生效

//判断现实状态,全1时要显示出来
var showType = "111111";//有几列,就有几个1if (!String.prototype.trim) {String.prototype.trim = function () {return this.replace(/^\s+|\s+$/g, '');};
}
String.prototype.replaceAll = function (s1, s2) {return this.replace(new RegExp(s1, "gm"), s2);
}
var cols = 5;//结束列数
var start = 0;//开始列数
var tr = [];
var maxtablenum = 3;//表格的数量,
var starttablenum = 0;//表格开始数量为0
for (var tablenum = starttablenum; tablenum <= maxtablenum; tablenum++) {var table = jQuery_1_8_3("#sth_content").find("table").eq(tablenum);if (table.length > 0) {var header = table.find("tr").eq(0);tr[tablenum] = table.find("tr").not(header);for (var col = start; col <= cols; col++)  {if (tablenum > 0) {var colflag = Number(col + tablenum * (cols + 1));} else {var colflag = col;}eval("var init_status_" + colflag + "=1");var td = header.find("td").eq(col);td.attr("id", "td" + colflag);var wid = td.width() + 25 + 20;jQuery_1_8_3("body").append("<div style='border-style:solid;border-width:1px;display:none;border-color:#ccc;background-color:#FFFCF7;z-index:1000; position:absolute;width:" + wid + "px;overflow-y:auto;margin-top:40px;' id='gc" + colflag + "'></div>");var txt = td.text();td.html("<div style='text-align:center;'>" + txt + "▼</div>");td.click(function (e) {if (e.stopPropagation) {e.stopPropagation();} else {e.cancelBubble = true;}});//var n = new Array();eval("var n" + colflag + " = new Array()");jQuery_1_8_3.each(tr[tablenum], function (index, domEle) {var temp = domEle.getElementsByTagName("td")[col].innerText;var tmparray = eval("n" + colflag);//if(eval("n"+col+".indexOf(temp)") == -1)if (temp != '') {if (eval("jQuery_1_8_3.inArray(temp,n" + colflag + ")") == -1) {eval("n" + colflag + ".push(temp)");}jQuery_1_8_3(domEle).attr("showType", showType)}});var high = td.height();// 弹出选择列表框的点击事件不冒泡到bodyjQuery_1_8_3("#gc" + colflag).click(function (e) {if (e.stopPropagation) {e.stopPropagation();}});td.mousedown(function (e) {var id = jQuery_1_8_3(this).attr('id').substring(2);if (document.getElementById('gc' + id).style.display == 'block' || document.getElementById('gc' + id).style.display == '') {document.getElementById('gc' + id).style.display = 'none';return;}document.getElementById('gc' + id).style.display = 'block';if (document.getElementById("u" + id + "99") == null) {jQuery_1_8_3("#gc" + id).append("<div id='u" + id + "99' style='height:20px;width:auto;cursor:hand;text-align:left;'><input id='chkall' class='chkall_" + id + "' type='checkbox' onchange='showgc(this)'/><span> 全部</span></div>");}for (var v = 0; eval("v<=n" + id + ".length"); v++) {if (document.getElementById("u" + id + v) == null && eval("n" + id + "[v]") != null) {jQuery_1_8_3("#gc" + id).append("<div id='u" + id + v + "' style='height:20px;width:auto;cursor:hand;text-align:left;' ><input type='checkbox' onchange='showgc(this)' /><span> " + eval("n" + id + "[v]") + "</span></div>");}var gcdiv = document.getElementById("gc" + id);gcdiv.style.left = getLeft(document.getElementById('td' + id)) + 5 + "px";gcdiv.style.top = getTop(document.getElementById('td' + id)) + 25 + "px";}//jQuery_1_8_3("#gc"+id).parent().find("input[type='checkbox']").attr("checked",false);for (var j = 0; j <= cols * (tablenum + 1); j++) {if (j != id) {if (document.getElementById('gc' + j) != null) {document.getElementById('gc' + j).style.display = 'none';}} else {document.getElementById('gc' + j).style.display = '';}}});}}
}
var end = cols * (tablenum + 1);
jQuery_1_8_3("body").click(function (e) {for (var j = 0; j <= end; j++) {if (document.getElementById('gc' + j) != null) {document.getElementById('gc' + j).style.display = 'none';}}
});
function maskOP(maskStrin, pos, bitValue) {var ipos = parseInt(pos);var tmp2 = maskStrin.substr(ipos + 1);var tmp1 = maskStrin.substr(0, ipos);return tmp1 + bitValue + tmp2;
}
function showgc(obj) {var jobj = jQuery_1_8_3(obj).parent();var oldid = jobj.parent().attr("id").substring(2);var id = jobj.parent().attr("id").substring(2);var tablenum2 = Math.floor(id / (cols + 1));if (tablenum2 <= 0) {tablenum2 = 0;} else {id -= tablenum2 * (cols + 1);}var selType = jobj.find("span").eq(0).text();var checkbox = jobj.find("input[type='checkbox']").eq(0);if (eval("init_status_" + oldid + "==1")) {jobj.parent().find("input[type='checkbox']").attr("checked", false);jQuery_1_8_3.each(tr[tablenum2], function (index, domEle) {var theShowType = maskOP(jQuery_1_8_3(domEle).attr("showType"), id, "0");jQuery_1_8_3(domEle).attr("showType", theShowType);domEle.style.display = "none";});checkbox.attr("checked", true);eval("init_status_" + oldid + "=0");}if (selType.trim() == "全部") {if (checkbox.attr("checked")) {//checkbox.attr("checked", false);jobj.parent().find("input[type='checkbox']").attr("checked", true);jQuery_1_8_3.each(tr[tablenum2], function (index, domEle) {var theShowType = maskOP(jQuery_1_8_3(domEle).attr("showType"), id, "1");jQuery_1_8_3(domEle).attr("showType", theShowType);if (theShowType == showType)domEle.style.display = "";});} else {//checkbox.attr("checked", true);jobj.parent().find("input[type='checkbox']").attr("checked", false);jQuery_1_8_3.each(tr[tablenum2], function (index, domEle) {var theShowType = maskOP(jQuery_1_8_3(domEle).attr("showType"), id, "0");jQuery_1_8_3(domEle).attr("showType", theShowType);domEle.style.display = "none";});}} else {jobj.parent().find("input[type='checkbox']").eq(0).attr("checked", false);var allcheckbox = jobj.parent().find(".chkall[type='checkbox']").eq(0);if (!allcheckbox.attr('checked')) {allcheckbox.attr('checked', false);}jQuery_1_8_3.each(tr[tablenum2], function (index, domEle) {var temp = domEle.getElementsByTagName("td")[id].innerText;var theShowType = jQuery_1_8_3(domEle).attr("showType");if (temp.replace(/\s/g, '') == selType.replace(/\s/g, '')) {if (checkbox.attr("checked")) {theShowType = maskOP(theShowType, id, "1");if (theShowType == showType)domEle.style.display = "";} else {theShowType = maskOP(theShowType, id, "0");domEle.style.display = "none";}jQuery_1_8_3(domEle).attr("showType", theShowType);}});}var gcdiv1 = document.getElementById("gc" + id);gcdiv1.style.left = getLeft(document.getElementById('td' + id)) + 5 + "px";
}
//获取元素的纵坐标
function getTop(e) {var offset = e.offsetTop;if (e.offsetParent != null) offset += getTop(e.offsetParent);return offset;
}
//获取元素的横坐标
function getLeft(e) {var offset = e.offsetLeft;if (e.offsetParent != null) offset += getLeft(e.offsetParent);return offset;
}

对页面中HTML的多表格筛选js相关推荐

  1. 页面中php传值后循环列表js获取点击的id

    页面中php传值后循环列表js获取点击的id值进行js操作 <script type="text/javascript" src="__PUBLIC__/js/jq ...

  2. 利用JS实现在页面中新建一个Excel表格

    一.功能展示: 二.需求分析: 1.在页面上显示4个输入框,分别输入用户的姓名,邮箱,手机号码,地址. 2.有一个添加按钮,当用户点击添加按钮,会动态添加用户的信息表格 3.实现单数行呈现黄色,双数行 ...

  3. html表格筛选,js实现表格筛选功能

    本应用就两个主要实现: 1.表格的id 和 class之间的命名关系 请看图: 将组名和个人信息联表格联系起来,这样会很好的操作表格 HTML代码: 前台设计组张三男浙江宁波李四男浙江宁波胡歌男浙江宁 ...

  4. html页面中引入自签名证书的js web资源出现net::ERR_CERT_AUTHORITY_INVALID

    其实是浏览器客户端对自签名的内容认为不安全引起的,临时方法可以再浏览器中先直接访问下那个自签名的https地址,然后再访问有引用的那个页面就可以了. 以下内容引用自https://www.morong ...

  5. echarts js 删除框选数据_echarts同一页面中四个图表切换的js数据交互方法示例

    需求: 点击tab页,切换四个不同的图表,ajax向后台请求数据,展示在四个不同的图表中. 其余的就不多说,直接上js代码了 示例代码: $(function() { $("#heart&q ...

  6. html excel导出的路径,html 导出多个excel表格数据-如何将html页面中的表格导出到excel表格...

    怎样将html表格导出到excel中啊?我用的是asp.net. stringbuilder拼接的也就是说,是用字符组成的表格,这并不是意义上的表格. 要实现导出EXCEL的较麻烦,给你讲一下解题思路 ...

  7. pythonexcel操作总结_python中常见关于Excel表格读写操作

    最近在写项目,刚好要运用到excel表格的一些读写,顺便总结一下我以前学过的几个关于表格的操作.在写项目中,经常会见到页面中数据导出到表格中,同时,也会有经常在表格中填写测试用例,然后获取数据来做自动 ...

  8. js获取html中图片路径,用js快速的获取html页面中图片的地址

    这次给大家带来用js快速的获取html页面中图片的地址,用js快速获取html页面中图片的地址的注意事项有哪些,下面就是实战案例,一起来看一下. 这篇文章主要介绍了js获取html代码中图片地址的实现 ...

  9. 微信小程序--在app.js 和其他页面中更改globalData的值

    微信小程序--在app.js 和其他页面中更改globalData的值 app.js中修改 其他页面 app.js中修改 在app.js中,应当在小程序初始化完成以后再更改全局变量的值,即在onLau ...

最新文章

  1. k8s概念入门之kube-proxy-针对1.1版本阅读
  2. Zabbix,Nagios,OneAPM Servers 安装部署
  3. python中有关数据持久存储:pickle模块的基本使用
  4. Scrapped or attached views may not be recycled. isScrap:false isAttached:true错误
  5. 2018大盘点 | R语言中文社区十大火爆文章
  6. 从SynchronizedCollection说起
  7. 黑苹果怎么进recovery_黑苹果怎么自定义Clover GUI启动选项 黑苹果修复Clover GUI启动选项教程...
  8. user-modify
  9. Excel - 单元格设置斜线 并 添加文字
  10. 史玉柱退休继续“烧脑”手游成新宠
  11. python种颜色循环_使用matplotlib颜色图进行颜色循环 - python
  12. 如何在一个月内快速瘦20斤?
  13. 程序员一直在找的日程安排工具
  14. 第一课:路由器宽带拨号入网(小米路由器)
  15. 企业进销存进货销售仓储管理系统-JAVA【数据库设计、源码、开题报告】
  16. 信息安全标准ISO27000
  17. 《金属切削原理》教学大纲
  18. 面试谈工资的时候,对方问你的期望薪资,如果反问对方「根据自己的能力能给多少」,合适吗?
  19. java姓名模糊查询_java 模糊查询。(转)
  20. 【搜集】Canopus ProCoder 2安装不了,老是提示没有足够空间的解决办法

热门文章

  1. 【linux】Ubuntu20.04使用apt安装tomcat9
  2. 【深度经验分享】我与伙伴云的成长之路
  3. 如何注册快手引流号?快手引流账号应该注意什么?
  4. 百度OCR文字识别及使用案例
  5. 在Android中将毫秒转换为时间
  6. 吃鸡买个自定义服务器,绝地求生自定义服务器怎么玩 自定义服务器使用说明...
  7. 翌加科技:抖音小店新手常见问题
  8. linux vim 编辑器的颜色方案等自定义配置
  9. 由罗胖跨年演讲想到的
  10. Android 判断真机与模拟器