2

I'm using EaselJS JavaScript library to load some images on an HTML5 canvas element.

They are perfectly loaded and positioned but I can't click them because onclick event never fires.

What am I doing wrong?

Here's the code I'm using:

<script src="easeljs-0.5.0.min.js"></script>
    
    <script>
        var canvas;
        var stage;
        var pictures = new Array(5);
        var pictLen = pictures.length;
        var imageCount = 0;
        //
        function init() {
            // cavas instantiation, testCanvas is the id of my canvas element
            canvas = document.getElementById("testCanvas");
            stage = new Stage(canvas);
            

            for (var i=0;i<pictLen;i++) {
                
                var img=new Image();
                img.src="img/"+i+".jpg";
                var j=0;
               
                img.onload = function(e){
                   var b = new Bitmap(e.target);
                   b.x =250*j;
                   b.y = canvas.height/2;
                   b.onClick = clickHandler;
                   j++;
                   stage.addChild(b);
                   stage.update();
                }
            }
            Tick.addListener(window);
            tick();
        }
        //
        function clickHandler(e){
            alert(e);
        }
        //
        function tick(){
            stage.tick();
        }
    </script>
4

0 回答 0