javascript - 在循环中分配容器的Y位置

我希望我的“ definitionContainer”的Y位置与“ questionMarkContainer”的Y位置相同。

我不确定如何在questionMarkContaineris单击时保存questionMarkContainer的Y位置并将其应用于“ definitionContainer” Y位置。

我试过了
definitionContainer.myNewCords = xOffsetNumberContainer;
definitionContainer.y = definitionContainer.myNewCords;

我如何完成任务。

 function writeOutDefinitionsQuestionMarksOnRight() {
        var yOffsetNumberContainer = 102;

            for (var c = 0; c < randomTermsForUserSorting.length; c++) {

                var questionMarkContainer = new createjs.Container();
                var Highlight = new createjs.Shape();
                Highlight.graphics.beginFill("hotPink").drawRoundRect(0, 0, 30, 25, 5);
                var HighLightlabel = new createjs.Text("?", "10pt arial bold", "white");
                HighLightlabel.textAlign = "center";
                HighLightlabel.x = 15
                HighLightlabel.y = 5
                questionMarkContainer.addChild(Highlight, HighLightlabel);
                self.stage.addChild(questionMarkContainer);
                questionMarkContainer.x = 720;
                questionMarkContainer.y = yOffsetNumberContainer;
                questionMarkContainer.termIndex = c;

                // calling a function to return the clickHandler function
                // because there was some crazy stuff with using the closure of
                // termIndex where the clickHandler function was always the last index.
                // The 'usual' method of getting around this situation wasnt working for some reason.
                var clickHandler = (function (termIndex) {
                    return function (e) {
                        var definitionContainer = new createjs.Container();

                        definitionContainer.myNewCords = yOffsetNumberContainer;

                        rect = new createjs.Shape();
                        rect.graphics.beginFill("DarkGreen").drawRoundRect(0, 0, 350, 150, 8);

                        var name = new createjs.Text(randomTermsForUserSorting[termIndex].Name, "12pt arial", "white");
                        name.x = 5;
                        name.y = 5;
                        name.lineWidth = 300;

                        var definitionText = new createjs.Text(randomTermsForUserSorting[termIndex].Definition, "10pt arial", "white");
                        definitionText.x = 5;
                        definitionText.y = 35;
                        definitionText.lineWidth = 330;

                        var xButtonRectangle = new createjs.Shape();
                        xButtonRectangle.graphics.beginFill("red").drawRoundRect(320, 5, 20, 20, 2);

                        var xTextCloseButton = new createjs.Text("X", "10pt arial", "white");
                        xTextCloseButton.x = 325;
                        xTextCloseButton.y = 7;

                        definitionContainer.addChild(rect, name, definitionText,xButtonRectangle, xTextCloseButton);

                        self.stage.addChild(definitionContainer);
                        definitionContainer.x = 300;

                        definitionContainer.y = yOffsetNumberContainer;

                        definitionContainer.addEventListener("click", function () {
                            self.stage.removeChild(definitionContainer);
                        });
                    }
                })(c);

                questionMarkContainer.addEventListener("click", clickHandler);
                yOffsetNumberContainer += 40;
            }

        }

最佳答案

看起来您只是在调整单个yOffsetContainer属性，该属性在click函数中引用。单击将在以后触发，并将使用yOffsetContainer变量，该变量已设置为项目数x40。它不会在每个项目内保存循环值。

您应该能够将循环值作为闭包中的参数传递，以将循环值存储在单击处理程序中：

var clickHandler = (function (termIndex, yOffset) {
    return function (e) {

        // OTHER CODE NOT SHOWN

        definitionContainer.y = yOffset;

        // MORE CODE NOT SHOWN

    }
})(c, yOffsetNumberContainer);