js控制下拉菜单，困扰很久了

pgameli 2009-03-10 03:22:21
这是js函数


<script type="text/javascript">

        function $(id) {

            return document.getElementById(id);

        }

        function showit(ID) {

            clearclosewin();

            $(ID).style.display = "block"

        }

        

        function clearclosewin() {

            if (typeof dodo != "undefined") clearTimeout(dodo);

        }

        function hiddenit(ID) {

            closewinwait(ID);

        }

        function closewinwait(ID) {

            dodo = setTimeout("closewin("+ID+")", 0200);

        }

        function closewin(ID) {

            $(ID).style.display = 'none';

        } 

    </script>



这是页面


<a onmouseover="showit('menu')" onmouseout="hiddenit('menu')">菜单</a>

            <div style="background-position: 0% 50%; position: absolute; display: none; width: 155px;

                height: 240px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial;

                -moz-background-inline-policy: -moz-initial; z-index: 1000; background-color: #007cd6;

                text-align: left; left: 500px; top: 350px;" id="menu" onmouseover="clearclosewin('menu')"

                onmouseout="hiddenit('menu')">

                <a href="#" style="text-decoration: none; font-size: small">

                    dasfdsfs

                <br />

            </div>


我想实现当鼠标移到“菜单”的时候，显示div,
失去焦点的时候隐藏div，可是总是隐藏不了，有错误
高手快来帮忙看看，
原帖参考http://topic.csdn.net/u/20090310/14/b096c132-aec8-4fe3-a20b-92cda83505d6.html
...全文
326 13 打赏 收藏 转发到动态 举报
写回复
用AI写文章
13 条回复
切换为时间正序
请发表友善的回复…
发表回复
pgameli 2009-03-10
  • 打赏
  • 举报
 回复
谢谢各位了
问题解决了
阿非 2009-03-10
  • 打赏
  • 举报
 回复 


<html>

<head>

<script type="text/javascript">

        function $(id) {

            return document.getElementById(id);

        }

        function showit(ID) {

            clearclosewin();

            $(ID).style.display = "block"

        }

        

        function clearclosewin() {

            if (typeof dodo != "undefined")            

               clearTimeout(dodo);

            

        }

        function hiddenit(ID) {

            closewinwait(ID);

        }

        function closewinwait(ID) {

            dodo = setTimeout("closewin('"+ID+"')", 0200);

        }

        function closewin(ID) {

            $(ID).style.display = 'none';

        } 

    </script>



</head>

<body>



<a onmouseover="showit('menu')" onmouseout="hiddenit('menu')">选项</a>

            <div style="background-position: 0% 50%; position: absolute; display: none; width: 155px;

                height: 240px; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial;

                -moz-background-inline-policy: -moz-initial; z-index: 1000; background-color: #007cd6;

                text-align: left; left: 500px; top: 350px;" id="menu" onmouseover="clearclosewin('menu')"

                onmouseout="hiddenit('menu')">

                <a href="#" style="text-decoration: none; font-size: small">

                    dasfdsfs

                <br />

            </div>

</body>

</html>

新建个html文件 把代码copy 运行
the_pain 2009-03-10
  • 打赏
  • 举报
 回复
你的方法名写错了。


<script type="text/javascript">

        function $(id) {

            return document.getElementById(id);

        }

        function showit(ID) {

            clearclosewin();

            $(ID).style.display = "block"

        }

        

        function clearclosewin() {

            if (typeof dodo != "undefined") clearTimeout(dodo);

        }

        function hiddenit(ID) {

            //这里写的closewinwait

            closewinwait(ID);

        }

        function closewinwait(ID) {

            dodo = setTimeout("closewin("+ID+")", 0200);

        }

        //方法名不一样

       // function closewin(ID) {

       //     $(ID).style.display = 'none';

       // } 

        function closewinwait(ID) {

            $(ID).style.display = 'none';

        } 

    </script>

zzxap 2009-03-10
  • 打赏
  • 举报
 回复
<script type="text/javascript">
function $(id) {
return document.getElementById(id);
}
function showit(ID) {
clearclosewin();
$(ID).style.display = "block"
}


function hiddenit(ID) {
$(ID).style.display = 'none';
}
搞那么复杂干什么。
</script>

WeekWant 2009-03-10
  • 打赏
  • 举报
 回复
$(ID).style.display = "block"
$(ID).style.display = 'none';

你自己仔细看看你的代码吧！！
这里好像有的有结束符（;），有的确没有！！
阿非 2009-03-10
  • 打赏
  • 举报
 回复 


function closewinwait(ID) {

            dodo = setTimeout("closewin('"+ID+"')", 0200);

        }

好久不写代码 真不行
pgameli 2009-03-10
  • 打赏
  • 举报
 回复
我靠!
WeekWant 2009-03-10
  • 打赏
  • 举报
 回复
function closewinwait(ID) {
dodo = setTimeout("closewin("+ID+")", 0200);
}
这里可能有问题！你可以先去掉setTimeout，在试试对与错！！
好像是这样：
dodo = setTimeout("closewin('+ID+')", 0200);
Teng_s2000 2009-03-10
  • 打赏
  • 举报
 回复
UP
pgameli 2009-03-10
  • 打赏
  • 举报
 回复
[Quote=引用 2 楼 Sandy945 的回复:]
在那个帖子回复了
[/Quote]
dodo表是的是div显示的时间，
如果不设置这个的话，
菜单失去焦点后div也隐藏了，没法选择下拉菜单的内容
koukoujiayi 2009-03-10
  • 打赏
  • 举报
 回复
原封不动地给你我做过的:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
obj.visibility=v; }
}
//-->
</script>
<style type="text/css">
<!--
.unnamed1 {
font-size: 10pt;
color: #FFFFFF;
cursor: hand;
background-color: #006699;
font-weight: bold;
padding: 0pt 0pt 0pt 5pt;
vertical-align: middle;
}
.unnamed2 {
font-size: 10pt;
background-color: #CCCCCC;
padding-left: 10px;
border-top: 1px solid #FFFFFF;
border-right: 1px solid #666666;
border-bottom: 1px solid #666666;
border-left: 1px solid #FFFFFF;
}
.unnamed0 {
border: 1px solid;
}
a:link {
font-size: 10pt;
color: #006699;
text-decoration: none;
}
a:hover {
font-size: 10pt;
color: #FF0000;
text-decoration: underline;
}
a:visited {
text-decoration: none;
color: #006699;
}
-->
</style>
</head>

<body>
<table width="268" height="25" border="0" cellspacing="0" class="unnamed0">
<tr>
<td width="91" height="15" class="unnamed1" onMouseOver="MM_showHideLayers('Layer1','','show')" onMouseOut="MM_showHideLayers('Layer1','','hide')">信息技术系</td>
<td width="87" class="unnamed1" onMouseOver="MM_showHideLayers('Layer2','','show')" onMouseOut="MM_showHideLayers('Layer2','','hide')">环境生态系</td>
<td width="84" class="unnamed1" onMouseOver="MM_showHideLayers('Layer3','','show')" onMouseOut="MM_showHideLayers('Layer3','','hide')">土木工程系</td>
</tr>
</table>
<div id="Layer2" style="position:absolute; left:99px; top:39px; width:76px; height:66px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000; visibility: hidden;" onMouseOver="MM_showHideLayers('Layer2','','show')" onMouseOut="MM_showHideLayers('Layer2','','hide')">
<table width="88" border="0" cellspacing="0">
<tr>
<td width="86" class="unnamed2">b1</td>
</tr>
<tr>
<td class="unnamed2">b2</td>
</tr>
<tr>
<td class="unnamed2">b3</td>
</tr>
<tr>
<td class="unnamed2">b4</td>
</tr>
<tr>
<td class="unnamed2">b5</td>
</tr>
</table>
</div>
<div id="Layer3" style="position:absolute; left:189px; top:39px; width:76px; height:63px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000; visibility: hidden;" onMouseOver="MM_showHideLayers('Layer3','','show')" onMouseOut="MM_showHideLayers('Layer3','','hide')">
<table width="88" border="0" cellspacing="0">
<tr>
<td width="86" class="unnamed2">c1</td>
</tr>
<tr>
<td class="unnamed2">c2</td>
</tr>
<tr>
<td class="unnamed2">c3</td>
</tr>
<tr>
<td class="unnamed2">c4</td>
</tr>
<tr>
<td class="unnamed2">c5</td>
</tr>
</table>
</div>
<div id="Layer1" style="position:absolute; left:13px; top:39px; width:76px; height:62px; z-index:1; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000; visibility: hidden;" onMouseOver="MM_showHideLayers('Layer1','','show')" onMouseOut="MM_showHideLayers('Layer1','','hide')">
<table width="88" border="0" cellspacing="0">
<tr>
<td width="86" class="unnamed2"><a href="../../a0.htm">C语言</a></td>
</tr>
<tr>
<td class="unnamed2"><a href="../../a.htm">C++语言</a></td>
</tr>
<tr>
<td class="unnamed2"><a href="../../a.htm">VC++语言</a></td>
</tr>
<tr>
<td class="unnamed2"><a href="../../a.htm">SQL Server</a></td>
</tr>
<tr>
<td class="unnamed2"><a href="../../a.htm">Access</a></td>
</tr>
</table>
</div>
</body>
</html>
阿非 2009-03-10
  • 打赏
  • 举报
 回复
在那个帖子回复了
chenwei175528 2009-03-10
  • 打赏
  • 举报
 回复
mark and up and study
PHP-二级联动下拉菜单之Form提交法实现
 author : lzb2007-02-14呵呵，马上就要过年了，在这里先给大家拜年了，过年好！遥想当年，这个小问题也困扰了我很久，现在写出来，跟大家分享一下。 本文主要是讲利用form提交方法实现 PHP-二级联动下拉菜单，当然现在有更好的选择，ajax实现无刷新的联动，不过在这里不做介绍。原理： 呵呵，其实也谈不上什么原理，就是在用户选择一次的时候是让表单实现一次提交，不过不
与数据库相结合的下拉菜单和树形目录全力奉献
作一个与数据库相结合的动态下拉菜单和与数据库相结合的动态目录树是我早都想做的两个程序，可是因为自己没有时间去写，另外感觉水平也不是很够，但是这连个可是困扰我很久的问题啊，怎么办？没办法只有去网上去搜索，可是大都是静态的，要不就是没有源码或者很少的介绍，但是我已经下定决心一定把它们解决掉。终于在别人的一个项目中我看到了在.net后台把javascript串和.net代码相结合的用法后很受...
树型结构~无限级联下拉列表框
返回目录 这个问题困扰了我很久，今天终于把它解决了，心中的喜悦可想而知，赶快把它记录一下 标题无限级联下拉列表框的含义： 可能有一个树型结构的表，它可能有ID,Name,ParentID,Level等字段，下面要实现的就是从一级节点开始，一级一级的列出来，并以 下拉列表框的形式体现出来，就像是Ｎ级联动。 效果图： 两个问题： １　建立操作时的联动，它不需要进行自动绑定 ２　编辑...
select 下拉菜单取值问题
提问： 我现在有一个select的下拉菜单，当我选定之后，触发onChange事件，然后根据所选的字段再去数据库查找，返回的值加载到另外一个select下拉菜单。怎么处理这种情况呢？    回答：//onChange事件,调用js的doChange方法,   获得选择的值,重新刷新页面,    function   doChange()   {    var   selectVal
Select option OnChange事件的各种问题解决
提问： 我现在有一个select的下拉菜单，当我选定之后，触发onChange事件，然后根据所选的字段再去数据库查找，返回的值加载到另外一个select下拉菜单。怎么处理这种情况呢？      回答： //onChange事件,调用js的doChange方法,   获得选择的值,重新刷新页面,     function   doChange()   {     va
.NET社区

62,051

社区成员

669,050

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧

+ 用AI写文章