JS绑定成功事件,没有绑定成功,求绑看看

 <!DOCTYPE html>
<html>
<head>
    <title></title>
    <mata http-equiv=”content-type” content=”text/html; charset=gb2312” />
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
            font-size: 14px;
            font-family: "微软雅黑";
        }

        #nav {
            margin-top: 50px;
            margin-left: 30px;
        }

        ul .one {
            float: left;
            background: #eedbdb;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #000000;
        }

        ul li {
            width: 120px;
            list-style: none;
        }

            ul li a {
                text-decoration: none;
            }

        .one ul {
            display: none;
        }

        ul .one:hover {
            background: #ff6a00;
        }
    </style>
</head>
<body>

    <ul id="nav">
        <li class="one">
            <a href="#">栏目一</a>
            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>

        </li>
        <li class="one">
            <a href="#">栏目二</a>


            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>
        <li class="one">
            <a href="#">栏目三</a>



            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>
        <li class="one">
            <a href="#">栏目四</a>

            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>
        <li class="one">
            <a href="#">栏目五</a>

            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>

    </ul>



</body>
</html>
<script type="text/javascript">

    var aA = document.getElementById('nav').getElementsByTagName('ul');
    console.log(aA);
    var This = this;
    for (var i = 0; i < aA.length; i++) { aA[i].onmouseover = function () { This.style.display = "block"; } }
</script>


* {

margin: 0;

padding: 0;

font-size: 14px;

font-family: "微软雅黑";

}

  #nav { margin-top: 50px; margin-left: 30px; } ul .one { float: left; background: #eedbdb; height: 30px; line-height: 30px; text-align: center; color: #000000; } ul li { width: 120px; list-style: none; } ul li a { text-decoration: none; } .one ul { display: none; } ul .one:hover { background: #ff6a00; } </style>


  <ul id="nav"> <li class="one"> <a href="#">栏目一</a> <ul class="two"> <li>二级栏目</li> <li>二级栏目</li> <li>二级栏目</li> </ul> </li> <li class="one"> <a href="#">栏目二</a> <ul class="two"> <li>二级栏目</li> <li>二级栏目</li> <li>二级栏目</li> </ul> </li> <li class="one"> <a href="#">栏目三</a> <ul class="two"> <li>二级栏目</li> <li>二级栏目</li> <li>二级栏目</li> </ul> </li> <li class="one"> <a href="#">栏目四</a> <ul class="two"> <li>二级栏目</li> <li>二级栏目</li> <li>二级栏目</li> </ul> </li> <li class="one"> <a href="#">栏目五</a> <ul class="two"> <li>二级栏目</li> <li>二级栏目</li> <li>二级栏目</li> </ul> </li> </ul>


其中This是指哪个对象呢? 应该是当前鼠标经过的ul对象吧,所以可以试试这样。

//var This = this; 
for (var i = 0; i < aA.length; i++) { aA[i].onmouseover = function () { this.style.display = "block"; }}

试试放在 window.onload = function() {}; 代码块里

这个什么? 看起来怎么这么复杂呢?

首先script代码块得放在html里吧,放在head里试试。
另外,在下面的样式中加上 display:block; 就不需要js了
ul .one:hover {
background: #ff6a00;
display:block;
}

对象事件都绑定错了,ul隐藏你绑定鼠标事件不会触发,给a绑定

 <!DOCTYPE html>
<html>
<head>
    <title></title>
    <mata http-equiv=”content-type” content=”text/html; charset=gb2312” />
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
            font-size: 14px;
            font-family: "微软雅黑";
        }

        #nav {
            margin-top: 50px;
            margin-left: 30px;
        }

        ul .one {
            float: left;
            background: #eedbdb;
            height: 30px;
            line-height: 30px;
            text-align: center;
            color: #000000;
        }

        ul li {
            width: 120px;
            list-style: none;
        }

            ul li a {
                text-decoration: none;
            }

        .one ul {
            display: none;
        }

        ul .one:hover {
            background: #ff6a00;
        }
    </style>
</head>
<body>

    <ul id="nav">
        <li class="one">
            <a href="#">栏目一</a>
            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>

        </li>
        <li class="one">
            <a href="#">栏目二</a>


            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>
        <li class="one">
            <a href="#">栏目三</a>



            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>
        <li class="one">
            <a href="#">栏目四</a>

            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>
        <li class="one">
            <a href="#">栏目五</a>

            <ul class="two">
                <li>二级栏目</li>
                <li>二级栏目</li>
                <li>二级栏目</li>
            </ul>
        </li>

    </ul>



</body>
</html>
<script type="text/javascript">
    var aA = document.getElementsByTagName('a');
    for (var i = 0; i < aA.length; i++) 
        aA[i].onmouseover = aA[i].onmouseout = function (e) {
            var t = (e || window.event).type;
            this.parentNode.getElementsByTagName('ul')[0].style.display =t=='mouseover'? 'block':'none'
        }
</script>