左右收缩表格 function tableOnLoad() { var tableObj=document.getElementById("testTable"); var colNumber=tableObj.rows.item(0).cells.length; var colObjs=tableObj.getElementsByTagName("td"); if(colNumber>5) { for(var i=5;i5){ for(var m=0;mminNumber+5;j--) { colObjs(j).style.display="none"; } } } function tableRightRetract() { var tableObj=document.getElementById("testTable"); var co...
function numberCells() { var count=0; for (i=0; i 1234 5678 9101112 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
JQuery 确实很方便,简单的代码,却能实现一些不错的功能。 代码如下: $(function(){ //交替显示行 $('#alternation').click(function(){ $('tbody > tr:odd', $('#example')).toggleClass('alternation'); }); //三色交替显示行 $('#alternationThree').click(function(){ $('tbody > tr:nth-child(3n)', $('#example')).t...
代码如下: /// /// //引入DataBinder.js include("DataBinder.js"); /* */ function Table(){ this.elmTable=null; //表格标签 this.templetRow=null; //模板行 this.displayBody=null; //显示区tbody标签 this.isOverChange=false; //鼠标移过时,是否改变颜色 this.hoverColor="#EBF3FD"; //鼠标移过颜色 this.isActiveChange=false; //行点击时,是否改变颜色 this.activeColor="#D9E8FB"; //行点击时颜色 this.activ...
代码如下: 原料库管理 function Page(iAbsolute,sTableId,sTBodyId,page) { this.absolute = iAbsolute; //每页最大记录数 this.tableId = sTableId; this.tBodyId = sTBodyId; this.rowCount = 0;//记录数 this.pageCount = 0;//页数 this.pageIndex = 0;//页索引 this.__oTable__ = null;//表格引用 this.__oTBody__ = null;//要分页内容 this.__dataRows__ = 0;//记录行引用 this.__oldTBody__ = null; this.__init__...
JavaScript 自动为表格增加序号 .index_tab{width:100%;border-collapse:collapse;border:1px solid #005892;margin:8px 0;} .index_tab td{line-height:35px;border:1px solid #005892;padding-left:4px;} tr.tr_top td{line-height:32px;border:none;background-color:#005892;color:#fff;font-weight:bold;} td.td_center{text-align:center;} .ys01{background-color:#E6F0FE;} window.onload = function(){ var oTable = ...
动态添加表格 function z() { q.innerHTML=q.innerHTML+'热烈欢迎你光临!!' } [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
对于复杂的操作情况,比如:添加一行之后,在这一行上还要进行相关的操作会显得有些吃力;本人比较喜欢表现层使用模板、标记填充数据的做法,于是自己做手做了个小组件,与大家一起分享。 组件运行截图: 设计思路: 在Table的thead中加入一行隐藏的行,当要添加一行时,复制一次隐藏的行,再将实例数据填充到这一行中相应的位置,填充完毕之后,再将这一行加到表格中去,整个操作完成。 模板:隐藏的行即相当于模板,当需要时...
表格高亮 * { font-size: 11px; font-family: verdana, arial, sans-serif; } table { border: 1px solid #ccc; margin: 0 auto; } th { background-color: #f7f7f7; } td, th { padding: 15px; border: 1px solid #ccc; } tr.alternate { background-color: #efd; } .bold { font-weight: bold; } .red { color: red; font-weight: bold; } .blue { background-color: blue; } /* Used with crosshairs.js */ .hoverHilight { b...
1.你真的懂JavaScript里面的Sort方法吗? 2.你知道JavaScript中 localeCompare 方法的函数体吗? 3.表格排序 方法 要哪些参数? JavaScript中的sort方法直接就提供了排序的功能,不需要我们自己写个循环一个个的判断。但其机制仍然是那样的, 代码如下: window.onload=function(){ var MyArr=new Array("red","green","gray"); MyArr.sort(); alert(MyArr.toString()); } 输出的结果为 gray,green,red;那如果为整数呢? 代码...
昨天弄了个表格隔行换色,但是只是一张表里换 如果一个页面里出现多个表格需要怎么整 捣鼓出新的结果 如下: 代码如下: function onloadEvent(func){ var one=window.onload if(typeof window.onload!=function){ window.onload=func } else{ window.onload=function(){ one(); func(); } } } function showtable(tableid){ var overcolor=#FCF9D8; var color1=#FFFFFF; var color2=#F8F8F8; var tablename=document.getElementBy...
Js实现表格隔行换色一例 body{ padding:0; margin:0; font:Arial; font-size:12px;} .bf{ padding:0; margin:auto;} .bf table{ text-align:center;line-height:14pt;} .bf th{ width:50px; padding:10px;} .f1{ background:#fff8f0;} .f2{ background:#f0f7ff;} .f3{ background:#f7f7f7;} 脚本之家欢迎你 2006年 2007年 2008年 2009年 总 4 2 56 43 10 4 10 10 10 76 10 9 总 10 10 10 10 2 10 12 10 10...
代码如下://使用要求: //1.将表格的Class命名为:sorttableHold, //2.表格放置在一个div中,此div设有overflow属性. //3.表格要求有ID,div要求有ID //4.要有JQuery.min.js文件 //5.OK. addEvent(window, "load", sortables_init); var SORT_COLUMN_INDEX; function sortables_init() { // Find all tables with class sortable and make them sortable if (!document.getElementsByTagName) return; tbls = document.getElementsByTa...
原理其实很简单:利用getElementsByTagName得到所有的元素,然后分别为奇数项和偶数项的元素添加背景颜色。 核心代码: 代码如下: function color() { //把表头设为紫色 var th = document.getElementById("th"); th.style.background = "violet" //1.得到所有元素 var trs = document.getElementsByTagName("tr"); var i; for(i = 1; i //2.改变元素的背景颜色 if(i % 2 == 0) { trs[i].style.background = "yellow"; } else { ...
通过判断是否为单数即可 然后设置下行的背景颜色就可以了 if(i%2==1) row.style.background = "#CCCCff"; else row.style.background = "#CCCCCC";