请问为什么我的JS代码执行不了,没有报错

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
#contian{padding:0px; margin:0px; position:relative}
#contian div{width:400px; height:200px; background-color:#CECECE;display:none; position:absolute; top:20px; padding:0px; margin:0px} #contian div ul{padding:0px; margin:0px; text-align:left}#contian div ul li{display:inline-block; padding:0px; margin:0px; font-size:13px}
#contian .active{background-color:#D8C410}

#contian>a{display:inline-block; width:100px; height:20px; float:left}
</style>
 <script>
    window.onload=function(){
      var Div=document.getElementById("contian")
      var OPr=Div.getElementsByTagName("a")
      var OLr=Div.getElementsByTagName("div")
    
     for(var i=0;i<OPr.length;i++)
     {  
         OPr[i].index=i
         OPr[i].hover=function(){
             for(var i=0; i<OPr.length;i++)
             {
                 OPr[i].className='';
                 OLr[i].style.display='none'
                 }
             this.className='active'
             
             OLr[this.index].style.display='block'
        
             };
         }
    }
 </script>
</head>

<body>
    <div id="contian">
          <a href="#" class="active">新闻热点</a>
          <a href="#">合作播报</a>
          <a href="#">行业咨询</a>
          <a href="#">运营攻略</a>
          <div style="display:block">   <ul>
                <li><a class="tab_menu" href="#">[新闻热点]</a><a class="tab_title" href="#">点点妙:欢庆“十一”送祝福</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[新闻热点]</a><a class="tab_title" href="#">点点妙携手移动端APP 开创棋牌游戏新模</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[新闻热点]</a><a class="tab_title" href="#">看棋牌大亨如何颠覆快播江湖</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[新闻热点]</a><a class="tab_title" href="#">棋牌行业:解密点点妙合作内幕 分成竟高达</a><span>2014-09-05</span></li>
            </ul></div>
          <div>    <ul>
                <li><a class="tab_menu" href="#">[合作播报]</a><a class="tab_title" href="#">收银妹代理棋牌游戏 成功晋级游戏女老板2</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[合作播报]</a><a class="tab_title" href="#">收银妹代理棋牌游戏 成功晋级游戏女老板1</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[合作播报]</a><a class="tab_title" href="#">IT精英放弃高薪只因想“玩”游戏</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[合作播报]</a><a class="tab_title" href="#">“干爹”扶持,乐猴棋牌开疆拓土</a><span>2014-09-05</span></li>
            </ul></div>
          <div>  <ul>
                <li><a class="tab_menu" href="#">[行业咨询]</a><a class="tab_title" href="#">收银妹代理棋牌游戏 成功晋级游戏女老板3</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[行业咨询]</a><a class="tab_title" href="#">紫金阁:代理棋牌游戏如何能稳赚不亏?</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[行业咨询]</a><a class="tab_title" href="#">你知道吗?“紫金阁”竟然升级做了“小三”</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[行业咨询]</a><a class="tab_title" href="#">都市娱乐赚钱首选 棋牌游戏代理</a><span>2014-09-05</span></li>
            </ul></div>
          <div>  <ul>
                <li><a class="tab_menu" href="#">[运营攻略]</a><a class="tab_title" href="#">加盟网络棋牌游戏的注意事项</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[运营攻略]</a><a class="tab_title" href="#">奇葩:一款可以自动赚钱的棋牌游戏</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[运营攻略]</a><a class="tab_title" href="#">代理棋牌游戏 紫金阁支招稳赚不亏</a><span>2014-09-05</span></li>
                <li><a class="tab_menu" href="#">[运营攻略]</a><a class="tab_title" href="#">棋牌行业内幕:什么时候代理棋牌游戏最合适</a><span>2014-09-05</span></li>
            </ul></div>
    </div>
</body>
</html>
阅读 5.5k
4 个回答

js不支持hover事件吧。
你这是在做什么?导航?

<ul>
    <li><a href="##">首页</a></li>
    <li><a href="##">文章中心</a>
        <ul>
            <li>asdfasdf</li>
        </ul>
    </li>
    <li><a href="##">产品中心</a></li>
    <li><a href="##">关于我们</a></li>
</ul>

clipboard.png

你那边抛出的异常就是找不到对于的div了。因为你a太多了。你应该起个class或者是什么,评论里放不了图片。

hover是css样式里面的,js里面是onmouseover 所以搞不出来

结合CSS中hover伪类及display显示和隐藏就可以,或者用JS设置点击/鼠标移入/鼠标移出事件触发处理函数来实现也是可以的。

hover 是jquery里面提供的方法,不是js原生的方法所以搞不出来,你应该引入jquery文件。
引入以后直接用jquery写呗,
$(function(){
var href=$("a","#contain");
var div=$("div","#contain");

//href.foreach(function(i){
$.foreach(href,function(index,i){
    i.hover(function(){
        i.removeClass().addClass('active');
        div[index].attr("display",'none')
    });
});

});

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题