珠江路在线
首页
互联网思维
硬件中心
软件中心
游戏中心
源码之家
今日新鲜事
传奇
软件开发培训班
>>
编程开发
>> JavaScript
软件新闻
编程开发
创意设计
操作系统
软件下载
智能表格
本文标签：智能表格
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="MSThemeCompatible" content="No"> <title>无标题文档</title> <script type="text/JavaScript"> <!-- //////////////////////////////////////////页面初始化/////////////////////////////////////// beginListen(); //////////////////////////////////////////页面初始化/////////////////////////////////////// //////////////////////////////////////////ajax类/////////////////////////////////////// function Ajax(url,recvT,stringS,resultF) { this.url = url; this.stringS = stringS; this.xmlHttp = this.createXMLHttpRequest(); if (this.xmlHttp == null) { alert("erro"); return; } var objxml = this.xmlHttp; objxml.onreadystatechange = function (){Ajax.handleStateChange(objxml,recvT,resultF)}; } Ajax.prototype.createXMLHttpRequest = function() { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) {} try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} try { return new XMLHttpRequest(); } catch(e) {} return null; } Ajax.prototype.createQueryString = function () { var queryString = this.stringS; return queryString; } Ajax.prototype.get = function () { url = this.url; var queryString = url+"?timeStamp=" + new Date().getTime() + "&" + this.createQueryString(); this.xmlHttp.open("GET",queryString,true); this.xmlHttp.send(null); } Ajax.prototype.post = function() { url = this.url; var url = url + "?timeStamp=" + new Date().getTime(); var queryString = this.createQueryString(); this.xmlHttp.open("POST",url,true); this.xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); this.xmlHttp.send(queryString); } Ajax.handleStateChange = function (xmlHttp,recvT,resultF) { if (xmlHttp.readyState == 4) { if (xmlHttp.status == 200) { resultF(recvT?xmlHttp.responseXML:xmlHttp.responseText); } else { alert("您所请求的页面有异常 。"); } } } //////////////////////////////////////////ajax类/////////////////////////////////////// //////////////////////////////////////////处理鼠标事件/////////////////////////////////////// //表格变色 var toBeColor = "#F8F9FC"; var backColor = "#FFFFFF"; function onChangTrColor(obj) { obj.parentNode.style.backgroundColor = toBeColor; obj.style.backgroundColor = toBeColor; var inputs = obj.parentNode.parentNode.getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++ ){ inputs[i].style.backgroundColor = toBeColor; inputs[i].parentNode.style.backgroundColor = toBeColor; } } function outChangTrColor(obj) { obj.parentNode.style.backgroundColor = backColor; obj.style.backgroundColor = backColor; var inputs = obj.parentNode.parentNode.getElementsByTagName("input"); for (var i = 0; i < inputs.length; i++ ){ inputs[i].style.backgroundColor = backColor; inputs[i].parentNode.style.backgroundColor = backColor; } } //////////////////////////////////////////处理鼠标事件/////////////////////////////////////// //////////////////////////////////////////处理页面操作/////////////////////////////////////// //复制所选 function copySelect(){ var checkboxs = document.getElementsByName("checkbox"); for (var i=0; i<checkboxs.length; i++) { if(checkboxs[i].checked == true){ checkboxs[i].checked = false; copyTr(checkboxs[i]); checkboxs[i].checked = true; } } } function copyTr(obj) { var tbody = document.getElementById("tbData").getElementsByTagName("tbody")[0]; var Str = obj.parentNode.parentNode; var tr = Str.cloneNode(true); tbody.appendChild(tr); } //删除所选 function delSelect(){ var checkboxs = document.getElementsByName("checkbox"); var table = document.getElementById("tbData"); var tr = table.getElementsByTagName("tr"); for (var i=0; i<checkboxs.length; i++) { if(tr.length==2){ checkboxs[i].checked = false; return; } if(checkboxs[i].checked==true){ removeTr(checkboxs[i]); i=-1; } } } function removeTr(obj) { var sTr = obj.parentNode.parentNode; sTr.parentNode.removeChild(sTr); } //全选按钮 function selectAll() { var checkboxs = document.getElementsByName("checkbox"); var mark = true; for (var i=0; i<checkboxs.length; i++) { if (checkboxs[i].checked==false){mark = false} } if (mark){ for (var i=0; i<checkboxs.length; i++) { checkboxs[i].checked = false; } }else{ for (var i=0; i<checkboxs.length; i++) { checkboxs[i].checked = true; } } } //////////////////////////////////////////处理页面操作/////////////////////////////////////// //////////////////////////////////////////处理键盘操作/////////////////////////////////////// //键盘事件 function beginListen(){ if(document.addEventListener){ document.addEventListener("keydown",keyDown,true); }else{ document.attachEvent("onkeydown",keyDown); } } function stopListen(){ document.detachEvent("onkeydown",keyDown); } //处理键盘事件 function keyDown(event){ if(event.keyCode==13){addTr()} if(event.keyCode==46){delTr()} } //增加表格 function addTr() { var tbody = document.getElementById("tbData").getElementsByTagName("tbody")[0]; var sTr = tbody.getElementsByTagName("tr")[0]; var tr = sTr.cloneNode(true); tbody.appendChild(tr); } //增加表格 function addTr() { var tbody = document.getElementById("tbData").getElementsByTagName("tbody")[0]; var trs = tbody.getElementsByTagName("tr"); var sTr = trs[trs.length-1]; var tr = sTr.cloneNode(true); tbody.appendChild(tr); } //删除表格 function delTr() { var table = document.getElementById("tbData"); var tr = table.getElementsByTagName("tr"); if(tr.length==2){return;} var lastTr = tr[tr.length-1]; lastTr.parentNode.removeChild(lastTr); } //////////////////////////////////////////处理键盘操作/////////////////////////////////////// //////////////////////////////////////////处理按钮事件/////////////////////////////////////// //自动填充 var currentObj; function showDiv(event,obj) { var eX = event.clientX; var eY = event.clientY; var sY = document.body.parentNode.scrollTop; var dY = eY + sY; var divShowInput = document.getElementById("divShowInput"); divShowInput.style.top = dY + "px"; divShowInput.style.left = eX+"px"; divShowInput.style.display = "block"; currentObj = obj; ////智能菜单//// fixMenu(); //判断焦点位置 var tds = obj.parentNode.parentNode.getElementsByTagName("td"); var tdOrder; for (var i = 0; i < tds.length; i++ ){ if(tds[i] === obj.parentNode){ tdOrder = i; } } //填充标题标题 var tdTitleTr = document.getElementById("tbData").getElementsByTagName("tr")[0]; var tdTitle = tdTitleTr.getElementsByTagName("td")[tdOrder]; document.getElementById("barTitle").innerHTML = tdTitle.innerHTML; //收集表格信息//判断重复 var trs = obj.parentNode.parentNode.parentNode.getElementsByTagName("tr"); var autoFillP = document.getElementById("autoFillP"); var bankM = true; for (var i = 0; i < trs.length; i++ ){ var inputValue = trs[i].getElementsByTagName("td")[tdOrder].getElementsByTagName("input")[0].value; if (inputValue != "") { bankM = false; var menus = autoFillP.getElementsByTagName("a"); if(menus.length > 0) { var beliveM = true; for (var j = 0; j < menus.length; j++ ){ if(menus[j].firstChild.nodeValue == inputValue) { beliveM = false; } } if(beliveM){ var Svalue = document.createElement("a"); Svalue.setAttribute("href","javascript:void 0"); Svalue.onclick = function () {fillInput(this)}; var Stext = document.createTextNode(inputValue); Svalue.appendChild(Stext); autoFillP.appendChild(Svalue); } }else{ var Svalue = document.createElement("a"); Svalue.setAttribute("href","javascript:void 0"); Svalue.onclick = function () {fillInput(this)}; var Stext = document.createTextNode(inputValue); Svalue.appendChild(Stext); autoFillP.appendChild(Svalue); } } } if(bankM) { var Svalue = document.createElement("a"); Svalue.setAttribute("href","javascript:void 0"); var Stext = document.createTextNode("数据空"); Svalue.appendChild(Stext); autoFillP.appendChild(Svalue); } } function fillInput(obj) { currentObj.value = obj.innerHTML; var divShowInput = document.getElementById("divShowInput"); divShowInput.style.display = "none"; } function clearInput() { currentObj.value = ""; var divShowInput = document.getElementById("divShowInput"); divShowInput.style.display = "none"; } function hideDiv(obj) { obj.parentNode.style.display = "none"; } //删除智能菜单已有数据 function fixMenu() { var autoFillP = document.getElementById("autoFillP"); var values = autoFillP.getElementsByTagName("a"); for (var i = values.length-1; i >= 0; i-- ){ autoFillP.removeChild(values[i]); } } //////////////////////////////////////////处理按钮事件/////////////////////////////////////// //////////////////////////////////////////数据发送/////////////////////////////////////// //////////////////////////////////////////数据发送/////////////////////////////////////// function sendData() { var sendName = new Array("ok","A1","A2","A3","A4","A5","A6","A7","A8","A9","A10","A11"); var trs = document.getElementById("tbData").getElementsByTagName("tbody")[0].getElementsByTagName("tr"); for (var i = 0; i < trs.length; i++) { var sendValue = new Array(); var values = trs[i].getElementsByTagName("input"); var postString = sendName[1] + "=" + values[1].value;; for (var j = 2; j < values.length; j++) { postString = postString + "&" + sendName[j] + "=" + values[j].value; } var SendAjax = new Ajax("isave.asp",0,postString,sendok); SendAjax.post(); function sendok(revData){ alert(revData); } } } //////////////////////////////////////////数据发送/////////////////////////////////////// //--> </script> <style type="text/css"> <!-- body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; background-color: #E9EDF7; } #tbBackground { background-color:#FFFFFF; text-align:center; } #tbData { background-color:#DDE3EC; } #tbData td { background-color:#FFFFFF; } #tbData input { width:50px; border:none; } #tbData .checkbox { width:15px; } #tbData thead { } #tbTopOpt a{ display:block; width:80px; padding:5px; background-color:#F8F9FC; border:solid 1px #999999; color:#000000; text-decoration: none; } #tbTopOpt a:hover{ background-color:#DDE3EC; } #tbBomOpt a{ display:block; width:80px; padding:5px; background-color:#F8F9FC; border:solid 1px #999999; color:#000000; text-decoration: none; } #tbBomOpt a:hover{ background-color:#DDE3EC; } #tbData a{ color:#000000; text-decoration: none; } #divShowInput { position:absolute; top:30px; left:350px; z-index:10; background-color:#F8F9FC; display:none; border:solid 1px #DDE3EC; width:100px; overflow:hidden; } #divShowInput a { display:block; background-color:#F8F9FC; color:#000000; text-decoration: none; text-align:center; width:auto; } #divShowInput a:hover { background-color:#DDE3EC; border-left:solid 2px #FF0000; border-right:solid 2px #FF0000; color:#FF0000; } #divShowInput p { cursor:hand; margin:0; padding:0; background-color:#F8F9FC; text-align:center; border-bottom:double #DDE3EC; } --> </style> </head> <body> <div id="divShowInput"> <p id="barTitle" onClick="hideDiv(this)"></P> <p id="defComP" onClick="hideDiv(this)"> 清空 </P> <p id="autoFillP"> Llinzzi Huanhuan Tom.com 超级长的长长长长长长 </P><div class="tj_content hidden-xs"><table width=600 border=0 cellspacing=0 cellpadding=2 align=center class=title14><tr align=center><td><a href="http://www.zhujiangroad.com/mobile/news/2020/4a17448.html" target=_blank > 如果你用华为手机，记得打开“开发人员选项”，手机性能瞬间提升 </a></td><td><a href="http://www.zhujiangroad.com/notebook/news/2022/6m85270.html" target=_blank > 俄罗斯国产笔记本电脑即将投产：售价1万元起步 </a></td></tr> <tr align=center><td><a href="http://www.zhujiangroad.com/notebook/news/2022/9a17682.html" target=_blank > 笔记本是要接口全，还是要接口先进？ </a></td><td><a href="http://www.zhujiangroad.com/hardware/news/2022/9a17687.html" target=_blank > 固态硬盘能取代内存吗？ </a></td></tr></table></div> </div> <table id="tbBackground" width="760" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td><table id="tbTopOpt" width="700" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td height="40" width="125">复制所选</td> <td width="537">删除所选</td> <td width="38"> </td> </tr> </table></td> </tr> <tr> <td><table id="tbData" width="750" border="0" align="center" cellpadding="0" cellspacing="1"> <thead> <tr> <td height="25" >全选</td> <td>A1</td> <td>A2</td> <td>A3</td> <td>A4</td> <td>A5</td> <td>A6</td> <td>A7</td> <td>A8</td> <td>A9</td> <td>A10</td> <td>A11</td> </tr> </thead> <tbody> <tr> <td><input class="checkbox" type="checkbox" name="checkbox" value="checkbox"></td> <td><input name="A1" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A2" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A3" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A4" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A5" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A6" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A7" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A8" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A9" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A10" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> <td><input name="A11" type="text" onFocus="stopListen()" onBlur="beginListen()" onDblClick="showDiv(event,this)" onMouseOver="onChangTrColor(this)" onMouseOut="outChangTrColor(this)"></td> </tr> </tbody> </table></td> </tr> <tr> <td><table width="700" border="0" align="center" cellpadding="0" cellspacing="0" id="tbBomOpt"> <tr> <td height="40" width="125">复制所选</td> <td width="537">删除所选</td> <td width="537">提交</td> <td width="38"> </td> </tr> </table></td> </tr> </table> </body> </html>
技术文章快速查找
javascript操作JSON的要领总结
IE6.0中使用Javascript支持png格式图片
前端开发必须知道的JS之原型和继承
TinyMCE 新增本地图片上传功能
深入理解JavaScript系列(6)：S.O.L.I.D五大原则之单一职责SRP
如何动态的导入js文件具体该怎么实现
js 覆盖和重载 函数
为指定的元素添加遮罩层的示例代码
相关下载
在线教程导航
软件应用
·
Windows8
·
Windows7
·
Word
·
Excel
·
PPT
·
WPS
Web开发
·
ASP
·
JavaScript
·
DIV+CSS
·
JSP
·
VbScript
·
XML
·
PHP
开发语言
·
VB
·
VC
·
ASP.NET
·
Java
·
C++
·
Delphi
数据库开发
·
MySQL
·
MsSQL
·
Access
·
Oracle
·
DB2
手机系统
·
Android
·
iOS
·
WindowsPhone
网站设计
·
Flash
·
Dreamweaver
·
Fireworks
平面设计
·
Photoshop
·
CorelDraw
·
AutoCAD
·
3DsMAX
·
Illustrator
网络技术
·
网站运营
·
网络安全
·
网络搭建
工具：
成语大全
邮编区号
全国地图
南京二手车
免费电影
汉字换拼音
繁体字转换
二维码
| 站长工具：
收录/反向链接
ALEXA排名
关键词排名
WHOIS
教程：
PPT
Excel
Word
Dreamweaver
Photoshop
|
ASP
PHP
|
ASP.NET
Java
|
SQL
MySQL
热门论坛：
游戏
美食
传奇
冒险岛
魔域
天龙八部
DNF
征途
游戏：
传奇
天龙八部
魔域
奇迹
DNF公益服
传奇世界
神途
梦幻西游
天龙八部
魔域
DNF
冒险岛
奇迹
魔域
传奇
单职业
天龙
魔域
梦幻西游
DNF
天龙八部
关于我们
广告报价
|
版权声明
：本网站归南京网爵数码科技有限责任公司版权所有。
苏ICP备05016148号-1
公安备案号 32010202010177
