问答详情
源自:2-3 DOM2级事件处理程序

这里为什么不行?

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

<script type="text/javascript">



window.onload=function(){

var bt=document.createElement("input");

bt.type="button";

bt.value="按钮";

bt.id="btn";

document.body.appendChild(bt);

bt.style.width="160px";

bt.style.height="60px";

}

function asd(){

alert(this.value);

}

var a=document.getElementById("btn");

a.addEventListener("click",asd(),false);

</script>

</head>

<body>

</body>

</html>

如题,加粗有底线的那段无效。。。不知为何。

http://www.imooc.com/video/2134

提问者:飞天意大利面神兽 2016-05-20 10:57

个回答

  • weibo_哆啦A梦有大口袋_0
    2016-05-23 09:21:41
    已采纳

    补充:代码执行顺序,从上到下,如果使用window.onload方法,window.onload方法最后执行

  • weibo_哆啦A梦有大口袋_0
    2016-05-23 09:16:23

    首先你要明白代码代码是从上倒下执行的,但是window.onload方法的意思就是当HTML结构加载完成后执行里面的代码,因为你的(

    var a=document.getElementById("btn");

    a.addEventListener("click",asd(),false);


    没有加在window.onload方法里面,所以被先执行了,但是你这里没有input标签,所以无法添加单击事件。

    简而言之,就是你先添加单击事件,再创建DOM节点,所以无法添加事件。

    解决问题请采纳,谢谢

  • weibo_哆啦A梦有大口袋_0
    2016-05-20 15:50:28

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
    window.onload=function(){
    var bt=document.createElement("input");
    bt.type="button";
    bt.value="按钮";
    bt.id="btn";
    document.body.appendChild(bt);
    bt.style.width="160px";
    bt.style.height="60px";
    //请把点击事件加载window.onload里面
    var a=document.getElementById("btn");
    a.addEventListener("click",asd,false);
    }
    function asd(){
    alert(this.value);
    }
    </script>
    </head>
    <body>
    </body>
    </html>

    解决问题请采纳,谢谢

  • qq_南通印点_03295260
    2016-05-20 13:38:33

    asd后面括号去掉,因为它绑定的是函数名