开发者社区 问答 正文

理事件一定要使用匿名函数吗?

今天在学习JS动画做一个简单的Demo时遇到一个问题
screenshot
screenshot
直接写成

btn.onclick = alert('123');

则会直接弹出一个提示框,这又是什么原因呢?

展开
收起
杨冬芳 2016-06-21 12:04:02 2413 分享 版权
1 条回答
写回答
取消 提交回答
  • IT从业

    js初学者往往容易混淆函数申明(定义)和函数执行

    创造一个函数

    function foo(){}

    或者

    var foo = function(){}

    这是最基本的两种方法。

    函数执行就是在这个函数后面加一个(),如果需要传参数,就是(a,b,c...)

    现在,回到问题上。onmouseover如果是一个函数,那么在鼠标移上去的时候,会触发这个函数;否则,没有任何效果。aLi[i].onmouseover = starMove(this,400),这行代码,先执行starMove(this,400),然后将其返回值赋给aLi[i].onmouseover。因为starMove(this,400)返回值不是一个函数,所以没有任何效果。

    至于函数是否需要名称,这个可有可无。但是,匿名函数没法重用。所以,如果不是一次性使用,我建议具名。代码稍作调整

    // 这样做的好处是,可以把确定的参数提前传进去
    aLi[i].onmouseover = starMove.bind(aLi[i],400)
    
    function starMove(iTarget){
        var obj = this;
        clearInterval(obj.timer);
        obj.timer = setInterval(function(){
            var speed = (iTarget-obj.offsetWidth)/8;
            speed=speed>0?Math.ceil(speed):Math.floor(speed);
            if(obj.offsetWidth==iTarget){
                clearInterval(obj.timer);
            }
            else{
                obj.style.width=obj.offsetWidth+speed+'px';
            }
        },30);
    }
    
    
    2019-07-17 19:44:44
    赞同 展开评论
问答分类:
问答地址: