能否简化一下这个js。
时间:2010-05-11
来源:互联网
下面的js能否合成一个?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <style> body { font-family: "Verdana","宋体"; font-size:12px; margin:0; padding:0; } a,a:visited { color:#666666; text-decoration:none; } a:hover{ color:#ff0000; text-decoration:none; } ul, li{ color:#999999; line-height:20px; } ol{ margin-top:6px; margin-left:16px; padding:0; list-style-type:none; color:#666666; } table, td ,th{ margin:0; padding: 0; border:0; font-size:12px; } img{ border:0; padding:0; margin:0; } .date{ float:right; margin-right:12px; } #struct{ margin:auto; width:1000px; } #left_bg{ background:url(../img/left_bg.jpg) #f4f4f4 repeat-x top left; } .litop{ margin-top:10px;} .view{ background:url(../img/view_bg1.jpg) no-repeat; padding-top:18px; padding-left:2px;} .viewfont a{ color:#0b0b0b; font-size:11px; font-weight:bold;line-height:20px;} .viewfont a:visited{ color:#0b0b0b; } .viewfont a:hover{ color:#ff0000; } .kuang_white{ border:1px #fff solid; background-color:#FFFFFF;} </style> </HEAD> <BODY> <table cellSpacing=0 cellPadding=0 align=center border=0 > <tr> <td class=left_bg vAlign=top width="24%"> <table cellSpacing=0 cellPadding=0 width="100%" border=0> <tr> <td class=bt onmouseover="this.className='bt_mouseover'" onclick=this.blur(); onmouseout="this.className='bt_mouseout'"><A href="#" onclick="showLayer(); return false;">报表下载、上报</A> </td> </tr> <tr> <td vAlign=top> <div class="zibt" id="aa" style="display:none"> <UL> <LI><A href="#">隐患月报</A></LI> <LI><A href="#">检查报表</A></LI> <LI><A href="#">事故报表</A></LI></UL> </div> </td> </tr> <tr> <td height=4></td> </tr> <tr> <td class=bt onmouseover="this.className='bt_mouseover'" onclick=this.blur(); onmouseout="this.className='bt_mouseout'"><A href="#">组织台帐</A></td> </tr> <tr> <td height=4></td> </tr> <tr> <td class=bt onmouseover="this.className='bt_mouseover'" onclick=this.blur(); onmouseout="this.className='bt_mouseout'"><A href="#" onclick="showLayer2(); return false;">工作计划</A> </td> </tr> <tr> <td vAlign=top> <div class="zibt" id="bb" style="display:none"> <UL> <LI><A href="#">年工作计划</A></LI> <LI><A href="#">月工作计划</A></LI> </UL> </div> </td> </tr> </table> <script type="text/javascript"> var $ = function(id){return document.getElementById(id)} function showLayer() { if($("aa").style.display == "none") { $("aa").style.display = "block" } else { $("aa").style.display = "none" } } </script> <script type="text/javascript"> var $ = function(id){return document.getElementById(id)} function showLayer2() { if($("bb").style.display == "none") { $("bb").style.display = "block" } else { $("bb").style.display = "none" } } </script> </BODY> </HTML>
提示:您可以先修改部分代码再运行
提示:您可以先修改部分代码再运行
作者: mmfeel 发布时间: 2010-05-11
合成一个,传元素ID
作者: iaw2001200 发布时间: 2010-05-11
引用:
原帖由 iaw2001200 于 2010-5-11 16:18 发表合成一个,传元素ID
作者: mmfeel 发布时间: 2010-05-11
var $ = function(id){return document.getElementById(id)} 定义两边完全就是浪费。。第二个函数里面这个不用再定义了
2楼的意思是 2个函数写成一个
showLayer(obj){
if($(obj).style.display == "none")
{
$(obj).style.display = "block"
}
else
{
$(obj).style.display = "none"
}
}
调用的时候就写showLayer(“aa”);showLayer(“bb”);
[ 本帖最后由 isayno 于 2010-5-12 09:46 编辑 ]
2楼的意思是 2个函数写成一个
showLayer(obj){
if($(obj).style.display == "none")
{
$(obj).style.display = "block"
}
else
{
$(obj).style.display = "none"
}
}
调用的时候就写showLayer(“aa”);showLayer(“bb”);
[ 本帖最后由 isayno 于 2010-5-12 09:46 编辑 ]
作者: isayno 发布时间: 2010-05-12
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> <style> body { font-family: "Verdana","宋体"; font-size:12px; margin:0; padding:0; } a,a:visited { color:#666666; text-decoration:none; } a:hover{ color:#ff0000; text-decoration:none; } ul, li{ color:#999999; line-height:20px; } ol{ margin-top:6px; margin-left:16px; padding:0; list-style-type:none; color:#666666; } table, td ,th{ margin:0; padding: 0; border:0; font-size:12px; } img{ border:0; padding:0; margin:0; } .date{ float:right; margin-right:12px; } #struct{ margin:auto; width:1000px; } #left_bg{ background:url(../img/left_bg.jpg) #f4f4f4 repeat-x top left; } .litop{ margin-top:10px;} .view{ background:url(../img/view_bg1.jpg) no-repeat; padding-top:18px; padding-left:2px;} .viewfont a{ color:#0b0b0b; font-size:11px; font-weight:bold;line-height:20px;} .viewfont a:visited{ color:#0b0b0b; } .viewfont a:hover{ color:#ff0000; } .kuang_white{ border:1px #fff solid; background-color:#FFFFFF;} </style> </HEAD> <BODY> <table cellSpacing=0 cellPadding=0 align=center border=0 > <tr> <td class=left_bg vAlign=top width="24%"> <table cellSpacing=0 cellPadding=0 width="100%" border=0> <tr> <td class=bt onmouseover="this.className='bt_mouseover'" onclick=this.blur(); onmouseout="this.className='bt_mouseout'"><A href="#" onclick="showLayer(1); return false;">报表下载、上报</A> </td> </tr> <tr> <td vAlign=top> <div class="zibt" id="c01" style="display:none"> <UL> <LI><A href="#">隐患月报</A></LI> <LI><A href="#">检查报表</A></LI> <LI><A href="#">事故报表</A></LI></UL> </div> </td> </tr> <tr> <td height=4></td> </tr> <tr> <td class=bt onmouseover="this.className='bt_mouseover'" onclick=this.blur(); onmouseout="this.className='bt_mouseout'"><A href="#" onclick="showLayer(2); return false;">组织台帐</A></td> </tr> <tr> <td height=4> <div class="zibt" id="c02" style="display:none"> <UL> <LI><A href="#">隐患月报</A></LI> <LI><A href="#">检查报表</A></LI> <LI><A href="#">事故报表</A></LI></UL> </div> </td> </tr> <tr> <td class=bt onmouseover="this.className='bt_mouseover'" onclick=this.blur(); onmouseout="this.className='bt_mouseout'"><A href="#" onclick="showLayer(3); return false;">工作计划</A> </td> </tr> <tr> <td vAlign=top> <div class="zibt" id="c03" style="display:none"> <UL> <LI><A href="#">年工作计划</A></LI> <LI><A href="#">月工作计划</A></LI> </UL> </div> </td> </tr> </table> <script type="text/javascript"> var $ = function(id){return document.getElementById(id)} function showLayer(id) { if($("c0"+id).style.display=="block") { $("c0"+id).style.display="none"; } else { for(var i=1 ; i<4 ; i++) { $("c0"+i).style.display="none"; if(i!=id) { } } $("c0"+id).style.display="block"; } } </script> </BODY> </HTML>
提示:您可以先修改部分代码再运行
提示:您可以先修改部分代码再运行
作者: qxq864298 发布时间: 2010-05-12
相关阅读 更多
热门阅读
-
office 2019专业增强版最新2021版激活秘钥/序列号/激活码推荐 附激活工具
阅读:74
-
如何安装mysql8.0
阅读:31
-
Word快速设置标题样式步骤详解
阅读:28
-
20+道必知必会的Vue面试题(附答案解析)
阅读:37
-
HTML如何制作表单
阅读:22
-
百词斩可以改天数吗?当然可以,4个步骤轻松修改天数!
阅读:31
-
ET文件格式和XLS格式文件之间如何转化?
阅读:24
-
react和vue的区别及优缺点是什么
阅读:121
-
支付宝人脸识别如何关闭?
阅读:21
-
腾讯微云怎么修改照片或视频备份路径?
阅读:28