怪异的JAVASCRIPT错误：Cannot read property 'style' of undefined ，用FOR语句添加触发就不行
<!DOCTYPEhtml><htmllang="pt"><head><title>test</title><styletype="text/css">#main-lef...
<!DOCTYPE html><html lang="pt"><head><title>test</title><style type="text/css"> #main-left{ width: 300px; height:500px; float: left; } #main-right{overflow:hidden;height:500px;margin:1px; } #aa{ width:200px;display:none; } #bb{ width:200px;display:none; } #cc{ width:200px;display:none; }</style><script type="text/javascript">function addLoadEvent(func){ var oldLoadedEvent = window.onload; if(typeof oldLoadedEvent !="function" ){ window.onload=func; }else { window.onload=function(){ oldLoadedEvent(); func(); } }} function ShowMenuFromLiToDiv() { var ulList=document.getElementById("list-main-left"); var liEli=ulList.getElementsByTagName("li"); var DivFather =document.getElementById("main-right"); var DivDisplay=DivFather.getElementsByTagName("div"); for (var i=0;i<3;i++) { console.log(i); liEli[i].onmouseover= function (){ DivDisplay[i].style.display="block"; //会出现这个错误提示：Uncaught TypeError: Cannot read property 'style' of undefined ，因为卡在这里了，所以不会触发右边DIV main-right DIPLAY显示 return false; } liEli[i].onmouseout= function (){ DivDisplay[i].style.display="none"; return false; } } //liEli[i] DivDisplay[i]但当使用如下被注释掉的笨办法手动添加0到2触发却可以完美工作，可以触发右边DIV main-right DIPLAY显示 /* liEli[0].onmouseover= function (){ DivDisplay[0].style.display="block"; return false; } liEli[0].onmouseout= function (){ DivDisplay[0].style.display="none"; return false; } liEli[1].onmouseover= function (){ DivDisplay[1].style.display="block"; return false; } liEli[1].onmouseout= function (){ DivDisplay[1].style.display="none"; return false; } liEli[2].onmouseover= function (){ DivDisplay[2].style.display="block"; return false; } liEli[2].onmouseout= function (){ DivDisplay[2].style.display="none"; return false; } */ } addLoadEvent(ShowMenuFromLiToDiv);</script></head><body<div id="main-left"><h3>Catalogs aa bb cc in left</h3><ul id="list-main-left"><li><a href=" ">aa</a></li><li><a href=" ">bb</a></li><li><a href=" ">cc</a> </li></ul></div><div id="main-right"><div id="aa"><h3>aa in right</h3><ul><li>aa in right</li></ul></div><div id="bb"><h3>bb in right</h3><ul><li>bb in right</li></ul></div><div id="cc"><h3>cc in right</h3><ul><li>cc in right</li></ul></div></div> <div class="aside"></div> <div class="main"></div></body></html>
展开
展开全部
window.onload = function () { my_change("ctrl-i"); function my_change(className) { // 图形变换 var my_obj = document.getElementsByClassName(className); for (var i = 0; i < my_obj.length; i++) { (function (index) { my_obj[index].onmouseover = function () { // body... 鼠标经过 my_obj[i].style.backgroundColor = "#000"; } })(i) } }}
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
