为了账号安全,请及时绑定邮箱和手机立即绑定

修改为外部引用js1文件后就出问题了

老师提供的源文件修改为外部引用后,调试工具一直提示

ReferenceError: area is not defined

修改后的代码如下(css部分略去),大家帮忙分析一下

---------------------------------

html部分

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title></title>

<link rel="stylesheet" href="css/style.css" />

</head>

<body>

<!--  慕课网课程公告开始 -->

<div  id="mooc"> 

<!--  头部 -->

<h3 id="moocTitle">最新课程<a href="#" target="_self">更多>></a> </h3>

<!--  头部结束 --> 

<!--  中间 -->

<div  id="moocBox">

    <ul id="con1">

        <li><a href="#">1.学会html5 绝对的屌丝逆袭(案例)</a><span>2013-09-18</span></li>

        <li><a href="#">2.tab页面切换效果(案例)</a><span>2013-10-09</span></li>

        <li><a href="#">3.圆角水晶按钮制作(案例)</a><span>2013-10-21</span></li>

        <li><a href="#">4.HTML+CSS基础课程(系列)</a><span>2013-11-01</span></li>

        <li><a href="#">5.分页页码制作(案例)</a><span>2013-11-06</span></li>

        <li><a href="#">6.导航条菜单的制作(案例)</a><span>2013-11-08</span></li>

        <li><a href="#">7.信息列表制作(案例)</a><span>2013-11-15</span></li>

        <li><a href="#">8.下拉菜单制作(案例)</a><span>2013-11-22</span></li>

        <li><a href="#">9.如何实现“新手引导”效果</a><span>2013-12-06</span></li>

    </ul>

    <ul id="con2">

    </ul>

</div>

<!--  中间结束 --> 

</div>

<!--  慕课网课程公告结束 --> 

<script type="text/javascript" src="js/script.js" ></script>

</body>

</html>

---------------------------------

js部分

window.onload=function(){

var area = document.getElementById('moocBox');

 var con1 = document.getElementById('con1');

 var con2 = document.getElementById('con2');

 var speed = 50;

 area.scrollTop = 0;

 con2.innerHTML = con1.innerHTML;


var myScroll = setInterval("scrollUp()",speed);

area.onmouseover = function(){

clearInterval(myScroll);

}

area.onmouseout = function(){

myScroll = setInterval("scrollUp()",speed);

}

}

 function scrollUp(){

if(area.scrollTop >= con1.scrollHeight) {

area.scrollTop = 0;

}else{

  area.scrollTop ++; 

}


正在回答

1 回答

你的area是在window.onload = function(){}中获取的 但是你的函数scrollUp是在window.onload = function(){}外的 所以获取的area是找不到的。解决方法:

window.onload=function(){

var area = document.getElementById('moocBox');

 var con1 = document.getElementById('con1');

 var con2 = document.getElementById('con2');

 var speed = 50;

 area.scrollTop = 0;

 con2.innerHTML = con1.innerHTML;


var myScroll = setInterval("scrollUp()",speed);

area.onmouseover = function(){

clearInterval(myScroll);

}

area.onmouseout = function(){

myScroll = setInterval("scrollUp()",speed);

}

 function scrollUp(){

if(area.scrollTop >= con1.scrollHeight) {

area.scrollTop = 0;

}else{

  area.scrollTop ++; 

}

}

或者 var area = document.getElementById('moocBox'); 放到window.onload=function前面。


0 回复 有任何疑惑可以回复我~
#1

鱼飞跃月 提问者

谢谢,
2016-04-24 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
信息滚动效果制作
  • 参与学习       47751    人
  • 解答问题       321    个

萌妹子带您快速学习滚动效果,掌握无缝滚动和歇间性滚动的制作方法

进入课程

修改为外部引用js1文件后就出问题了

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信