Question

使用for循环我创建10个不同的Surface。通过点击其中一个，我想得到这个表面的内容。但那不起作用。相反，我总是得到最后创建的Surface的内容（在我的情况下，它是9）。我需要更改以获取所选（单击）曲面的内容而不是上次创建的内容？

这是我的代码：

for (f = 0; f < 10; f++) {
        var draggable = new Draggable({
            xRange: [0, 1000],
            yRange: [0, 1000]
        });

        var surface = new Surface({
            size: [true, true],
            content: f,
            properties:{
                fontSize:'16px',
                cursor: 'pointer',
                borderRadius:'50px',
                backgroundColor: '#C0C0C0',
                border:'solid'
            }
        });

        surface.on("click",function(){alert(surface.content)});

        surface.pipe(draggable);        
        mainContext.add(draggable).add(surface);
  }

Answer 1

正在选择正确的曲面。问题出在点击功能surface.content的引用中。每次更换表面参考，直到最后一个表面保留。引用在函数中使用this.content单击的当前曲面，因为this绑定到单击函数中当前单击的曲面。

<强> Example code Here

for (f = 0; f < 10; f++) {
    var draggable = new Draggable({
        xRange: [0, 1000],
        yRange: [0, 1000]
    });

    var surface = new Surface({
        size: [true, true],
        content: f,
        properties: {
            fontSize: '16px',
            cursor: 'pointer',
            borderRadius: '50px',
            backgroundColor: '#C0C0C0',
            border: 'solid'
        }
    });

    surface.on("click", function () {
        alert(this.content)
    });

    surface.pipe(draggable);
    mainContext.add(draggable).add(surface);
}

单击曲面选择错误的曲面

1 个答案: