我怎样才能让按钮删除其中一个框？

Question

这段代码在几分钟内就可以正常工作，我突然收到错误 #2032。我刚开始学习 AC3，显然做错了什么。有人可以帮我解释一下吗？

<fx:Script>

    <![CDATA[
        import mx.containers.Canvas;
        import mx.containers.Panel;
        import mx.events.FlexEvent;
        import mx.events.FlexMouseEvent;

        import spark.components.Button;


        public function createBoxes():void 
        {

            //create a Panel 
            var colorsPanel:Panel = new Panel(); colorsPanel.layout = "absolute"; colorsPanel.width = 250; colorsPanel.height = 250;
            //add the Panel to the Application
            addElement(colorsPanel);
            //create a red box 
            var redBox:Canvas = new Canvas(); redBox.x = 70; redBox.y = 70; redBox.width = 50; redBox.height = 50; redBox.setStyle("backgroundColor", 0xFF0000);
            //create a green box 
            var greenBox:Canvas = new Canvas(); greenBox.x = 90; greenBox.y = 90; greenBox.width = 50; greenBox.height = 50; greenBox.setStyle("backgroundColor", 0x00FF00);
            //create a blue box 
            var blueBox:Canvas = new Canvas(); blueBox.x = 100; blueBox.y = 60; blueBox.width = 50; blueBox.height = 50; blueBox.setStyle("backgroundColor", 0x0000FF);
            //add the boxes to the Panel
            var Button:spark.components.Button = new spark.components.Button(); Button.x = 80; Button.y =160; Button.label ="removeG";
            colorsPanel.addElement(redBox); 
            colorsPanel.addElement(greenBox); 
            colorsPanel.addElement(blueBox);
            colorsPanel.addElement(Button); 
            Button.addEventListener(MouseEvent.CLICK,removeBox);

        }

    public function removeBox(evt:MouseEvent):void
    {

    }

    ]]>
</fx:Script>
<s:Button id="But1" x="45" y="40" label="Click" click="createBoxes()"/>

Answer 1

是的，就像 Sam 说的，您需要使用按钮实例来添加事件侦听器。

        <![CDATA[
            import mx.containers.Canvas;
            import mx.containers.Panel;
            import mx.events.FlexEvent;
            import mx.events.FlexMouseEvent;

            import spark.components.Button;

            private var buttonToPanelMap:Object={};

    public function createBoxes():void 
    {

        //create a Panel 
        var colorsPanel:Panel = new Panel();
        colorsPanel.layout = "absolute";
        colorsPanel.width = 250;
        colorsPanel.height = 250;
        //add the Panel to the Application
        addElement(colorsPanel);

        //create a red box 
        var redBox:Canvas = new Canvas();
        redBox.x = 70;
        redBox.y = 70;
        redBox.width = 50;
        redBox.height = 50;
        redBox.setStyle("backgroundColor", 0xFF0000);

        //create a green box 
        var greenBox:Canvas = new Canvas();
        greenBox.x = 90;
        greenBox.y = 90;
        greenBox.width = 50;
        greenBox.height = 50;
        greenBox.setStyle("backgroundColor", 0x00FF00);

        //create a blue box 
        var blueBox:Canvas = new Canvas();
        blueBox.x = 100;
        blueBox.y = 60;
        blueBox.width = 50;
        blueBox.height = 50;
        blueBox.setStyle("backgroundColor", 0x0000FF);

        //add the boxes to the Panel
        colorsPanel.addElement(redBox); 
        colorsPanel.addElement(greenBox); 
        colorsPanel.addElement(blueBox);

        var boxRemoverBtn:Button = new Button();
        boxRemoverBtn.x = 80;
        boxRemoverBtn.y =160;
        boxRemoverBtn.label ="removeG";
        colorsPanel.addElement(boxRemoverBtn);
        boxRemoverBtn.addEventListener(MouseEvent.CLICK,removeBox);
        buttonToPanelMap[boxRemoverBtn] = colorsPanel;

    }

    public function removeBox(evt:MouseEvent):void
    {
        removeElement(buttonToPanelMap[evt.target] as Panel);
    }

        ]]>
    </fx:Script>
    <s:Button id="But1" x="45" y="40" label="Click" click="createBoxes()"/>