通过未来函数循环和设置全局变量[重复]答案

【问题标题】：Looping and setting global variables through a future function [duplicate]通过未来函数循环和设置全局变量[重复]
【发布时间】：2013-06-18 00:36:02
【问题描述】：

我得到了这部分代码，我似乎无法运行。我想知道您是否有任何想法，这似乎是一个范围界定问题。

这是我认为已损坏的代码部分。

                click: function(layer) {
                    selectedR = r;
                    selectedC = c;
                    render();
                },

问题是当我单击图像时它会执行函数，但是 selectedR/selectedC 的值总是设置为 8,8，这意味着它不会从 r,c 中获取变量值，直到函数实际点击了。你能想出我能做到这一点的方法吗？我基本上想知道我点击的项目的r，c。如果有帮助，我正在使用 JQuery/JCanvas 库。下面是上下文中的代码。

var selectedR;
var selectedC;


function drawPieces(){
    for( var r = 0; r < 8; r++){
        for(var c = 0; c < 8; c++){
            var x = boardLeft + (c * tileWidth);
            var y = boardTop + (r * tileHeight);
            var piece = gameboard[r][c];

            if(piece.pieceCode == ChessPieceEnum.EMPTY){
                continue;
            }

            $("canvas").drawImage({
                layer: true,
                source: piece.pieceCode.normalImage,
                x: x, 
                y: y,
                cursor: "pointer",
                click: function(layer) {
                    selectedR = r;
                    selectedC = c;
                    render();
                },
                fromCenter: false
            });

            piece.x = x;
            piece.y = y;
        }
    }
}

【问题讨论】：

著名的i循环问题
这是 JavaScript 中一个极其常见的问题的一个实例。它实际上是数十个（如果不是数百个）类似问题的副本:-)
感谢您的快速回复！抱歉，我对 Javascript 还很陌生，不确定要搜索什么。对不起 Dup！

标签： javascript jquery scope jcanvas

【解决方案1】：

所以看起来传递给点击函数的图层对象是对自身的引用。因此，只需将 r/c 添加到 layer 对象，就可以在匿名函数中访问它。

function drawPieces(){
    for( var r = 0; r < 8; r++){
        for(var c = 0; c < 8; c++){
            var x = boardLeft + (c * tileWidth);
            var y = boardTop + (r * tileHeight);
            var piece = gameboard[r][c];

            if(piece.pieceCode == ChessPieceEnum.EMPTY){
                continue;
            }

            $("canvas").drawImage({
                layer: true,
                source: piece.pieceCode.normalImage,
                x: x, 
                y: y,
                r: r,
                c: c,
                cursor: "pointer",
                click: function(layer){
                    onPieceClick(layer.r, layer.c);
                },
                fromCenter: false
            });

            piece.x = x;
            piece.y = y;
        }
    }
}

function onPieceClick(r,c){
    selectedR = r;
    selectedC = c;
    render();
}

【讨论】：