我想点击一个div就写一句话，用函数实现，请问哪里还有问题，谢谢

现在主要是
key.onclick = playNote;
和
function playNote()
    {
        var note = this.note;
        var divConsole = document.getElementById('divConsole');
        divConsole.innerHTML += note + " ; ";
    }不能绑定，现在的运行结果是当我点击div时显示的是undefined

解决方案 »

  1.   

    <html>
    <head>
        <title>音乐按键</title>
        <link href="css/musicButton.css" rel=Stylesheet type="text/css" />
        <script language=javascript type="text/javascript">
        //var note;
        function setColor()
        {
            var keyboard = document.getElementById('keyboard');
            
            var divArray = keyboard.getElementsByTagName('div');
            for(var i = 0 ; i < divArray.length ; i++)
            {
                var key = divArray[i];
                var classes=(key.className).split(" ");
                 
                var note = classes[0];
                
                key.note = note;
                alert(note);
                key.onclick = playNote;
            }
            
        }
        function playNote()
        {
            var note = event.srcElement.note;
            var divConsole = document.getElementById('divConsole');
            divConsole.innerHTML += note + " ; ";
        }
        </script>
    </head>
    <body onload="setColor();">
    <div id=keyboard>
    <div style="height:40;width:40"  class="do MusicButton">1</div>
    <div style="height:40;width:40"  class="re MusicButton">2</div>
    <div style="height:40;width:40"  class="mi MusicButton">3</div>
    <div style="height:40;width:40"  class="fa MusicButton">4</div>
    <div style="height:40;width:40"  class="so MusicButton">5</div>
    <div style="height:40;width:40"  class="la MusicButton">6</div>
    <div style="height:40;width:40"  class="xi MusicButton">7</div>
    </div>
    <div id=divConsole style="height:400;width:400"  ></div>
    </body>
    </html>