第一个太简单就不说了,第二个也很简单,但每个人都有不同的实现方法,下面给一个比较简洁的做法,支持IE6、IE7、FF2,其他浏览器未测试(可以扩展一下用到ASP.NET的GridView里): 鼠标划过表格行变色-简洁实现 #tb{width:666px;border-collapse:collapse;border:1px solid #EEE;font-size:14px;} #tb th{background:#EEE;border-bottom:1px solid #CCC;padding:4px;} #tb td{border:1px solid #EEE;padding:4px;} 商品名称 单...
表格随机排序练习 by 阿会楠 #main{ width:700px; } #main div{ width:200px; margin-left:10px; margin-top:20px; float:left; } div table{ width:100%; } function arrRand(obj){ var a = new Array(); for(var i = 0;i A B C D E F 脚本之家 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
动态添加表格行 选择产品编号(数字)'; document.getElementById("change").innerHTML+=strS; } } // 添加产品品种数: 产品编号 产品名称 数量 单价 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
代码如下: jquery 奇偶变色 $(document).ready(function() { $('tr').addClass('odd'); $('tr:even').addClass('even'); //奇偶变色,添加样式 }); #hacker tr:hover{ background-color:red; //使用CSS伪类达到鼠标移入行变色的效果,比Jquery 的mouseover,hover 好用 } .odd { background-color: #ffc; /* pale yellow for odd rows */ } .even { background-color: #cef; /* pale blue for even rows */ } As You Li...
JS: 代码如下:/* @parem object the tbodys object @parem object trs object (must be null) @parem string the className of onmousedown @parem string the className of onmouseout */ function order(tt,old,classover,classout) { var sf = arguments.callee; //get the function self var trs = tt.getElementsByTagName(tr); for(var i=0;i<trs.length;i++) { trs[i].onmousedown = function () { if(this.style.cursor ...
1,交叉加亮 2,点击左上角的 "1;1","2;2"观察所有单元值的变化3,点击左上角的 "3,3","4,4"观察所有单元字体的变化4,点击单元后,该单元颜色发生变化,并直至点击下一单元5,将th与td分开; Gu Laicheng, 2008.12.25 交叉高亮显示 body,th,td { font-size: 10pt; } .Tlist1 { border-collapse:collapse;table-layout:fixed;width:710px; } .outit { background: #EEDDFF; } .ovrit { background: #AADDFF; } .cross { background: #...
代码如下 var tableElem = document.getElementById("MyTable"); var tbodyElem = tableElem.getElementsByTagName("tbody")[0]; var trElem = document.createElement("tr"); var td1 = document.createElement("td"); td1.onclick = "EditCell()"; td1.width = "45%"; td1.innerText = " "; trElem.appendChild(td1); tbodyElem.appendChild(trElem); alert(tbodyElem.innerHTML); 这段代码动态创建一个tr和td,并在td中设置了一...
无标题文档 *{font-family:Arial, Helvetica, sans-serif;font-size:14px;border:none;} body{text-align:center;} table{margin:100px auto;} td{width:100px;height:24px;text-align:center;line-height:24px;border:1px solid silver;} .red{color:red;} .top{background:#CCCCCC;cursor:pointer;} .up{background:#FFFFCC url(/upload/20090211095733175.gif) no-repeat right 5px;} .down{background:#FFFFCC url(/upl...
下面的代码解决了这个问题:当表格被载入的时候,TD的宽度是原定的长度,不会撑开TD,也不会影响其他TD,点击某行会按照本行所有单元格中行数最多的单元格的长度伸长行高。用户体验很好。【优点】 1、对开发人员指定的表格没有任何影响; 2、使用简单; 3、被定义的表格样式可以随意的定制你的样式,不对你的样式构成影响; 4、移植性好,扩展性好。 【缺点】 目前用IE7测试正常,但不支持FireFox,工作比较忙,没时间更正,希望网...
1、是图片 一般就是准备两张图片 当鼠标放上去即显示另外一张图片 2、变换颜色如下所写,这个是变化背景颜色
隐藏表格列,最常见的是如下方式: 代码如下:td.style.display = "none";这种方式的效率极低。例如,隐藏一个千行表格的某列,在我的笔记本(P4 M 1.4G,768M内存)上执行需要约 4000毫秒的时间,令人无法忍受。例如如下代码: 代码如下: //-------------------------------------------------------- // 时间转为时间戳(毫秒) function time2stamp(){var d=new Date();return Date.parse(d)+d.getMilliseconds();} //-------...
一、SortTable说明 SortTable version 2 7th April 2007 Stuart Langridge, http://www.kryogenix.org/code/browser/sorttable/ Instructions: Download this file Add to your HTML Add class=”sortable” to any table you'd like to make sortable Click on the headers to sort Thanks to many, many people for contributions and suggestions. Licenced as X11: http://www.kryogenix.org/code/browser/licence.html This ...
stone.js //**************************************神吹表格操作函数******************************************************* //隐藏列 function setHiddenRow(tb,iCol){ for (i=0;itb.rows[i].cells[iCol].style.display = oTable.rows[i].cells[iCol].style.display=="none"?"block":"none"; } } //隐藏行 function setHiddenRow(tb,iRow){ tb.rows[iRow].style.display = oTable.rows[iRow].style.display == "none"?"block"...
仿Excel表格演示 //////////////////////////////////////////变量—初始化/////////////////////////////////////// var toBeColor = "#F8F9FC"; var backColor = "#FFFFFF"; var tableId = "tbData"; var table; var tbody; var divShowInput; window.onload=function(){ beginListen(); table = document.getElementById(tableId); tbody = table.getElementsByTagName("tbody")[0]; actionFill (); otherFill(); ...
中国北京 中国上海 var tabobj = document.getElementById("ch"); //获取 Table 对象 for( var i=0; i [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]