xiaoke_code 2016-03-16 14:57 采纳率: 0%
浏览 1776
已采纳

javascript中变量作用域的问题

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>分享到</title>
    <style type='text/css'>
    *{
        margin:0;
        padding:0;
    }
    li {
        list-style: none;
        text-align: center;
        margin-top:3px;
    }
    a{
        text-decoration: none;
    }
    #fenXiangArea{
        width:100px;
        height:200px;
        position:absolute;
        top:40%;
        left:-100px;
        background-color: #ccc;
    }
    #fenxiang{
        width:20px;
        height:70px;
        position:absolute;
        top:35%;
        left:100px;
        background-color: yellow;
    }
    </style>
    <script type="text/javascript"> 
    var timer=null;
    //开始运动的逻辑   单个物体的运动
        function startMove(obj,iTarget){
            var iSpeed=0;
            clearInterval(timer);
            timer=setInterval(function(){               
                obj.offsetLeft<iTarget?iSpeed=1:iSpeed=-1;
                if(Math.abs(obj.offsetLeft-iTarget)<1){
                    clearInterval(timer);
                    obj.style.left=iTarget+'px';
                }
                else{
                    obj.style.left=obj.offsetLeft+iSpeed+'px';
                }
            },30);
        }
        window.onload=function(){
            var fenXiangArea=document.getElementById('fenXiangArea');
            fenXiangArea.onmouseover=function(){
                startMove(fenXiangArea,0);
            }
            fenXiangArea.onmouseout=function(){
                startMove(fenXiangArea,-100);
            }
        }
    </script>
</head>
<body>
    <div id='bianxian'  style='border:1px solid blue;width:1px;height:400px' ></div>
    <div id='fenXiangArea' >
        <ul>
            <li><a href='javascript:;'/>微信</li>
            <li><a href='javascript:;'/>QQ</li>
            <li><a href='javascript:;'/>豆瓣</li>
            <li><a href='javascript:;'/>知乎</li>
            <li><a href='javascript:;'/>微博</li>
            <li><a href='javascript:;'/>网易</li>
            <li><a href='javascript:;'/>淘宝</li>
            <li><a href='javascript:;'/>朋友圈</li>
        </ul>
        <div id='fenxiang'>分享到</div>
    </div>
</body>
</html>

各位大神注意 一下 我这里的 var timer=null;timer是全局变量

但是我把timer改成局部变量 就是在startMove()方法里面定义了这个变量   ‘
代码就会出现抖动!!
    function startMove(obj,iTarget){
            var iSpeed=0;
            var timer=null;
            clearInterval(timer);
            timer=setInterval(function(){               
                obj.offsetLeft<iTarget?iSpeed=1:iSpeed=-1;
                if(Math.abs(obj.offsetLeft-iTarget)<1){
                    clearInterval(timer);
                    obj.style.left=iTarget+'px';
                }
                else{
                    obj.style.left=obj.offsetLeft+iSpeed+'px';
                }
            },30);
        }

    初学JavaScript,还望大神赐教
  • 写回答

1条回答 默认 最新

      报告相同问题?

      相关推荐 更多相似问题

      悬赏问题

      • ¥25 接口/特征方法的异常错误返回如何判断是否需要设计
      • ¥40 代码+预测分析,文件私信发哦(价格可商量)
      • ¥15 GAMES101 HW1 无法定义
      • ¥15 pycharm不管允许什么代码都出错,都会出现下面的情况。
      • ¥15 boost::integrate的用法
      • ¥20 51单片机输出pwm时无法调节频率,如何解决?
      • ¥15 DSP28335 AD采集正弦波
      • ¥50 pwwinauto调式修改
      • ¥30 关于#单片机#的问题:单片机基于51单片机开发计时器,使其实现以下功能:(1)开发板上四个独立按键分别控制计时器的启停、计时器的复位(按下计时值归零)、计时位切换、计时时间的递增
      • ¥15 看个代码。做个详细的解说