0

在 jqPuzzle 的设置中,我可以传递当人完成拼图时将调用的成功函数。问题是我的页面上有几个谜题,我想对当前完成的谜题进行操作,但结果只有几秒钟和移动次数。如何获得当前已完成的拼图?

这是我谈论的演示:http: //polishwords.com.pl/dev/puzzle/exa.php

重要的部分是:

function initializePuzzle()
{
    var settings = {
      cols: 3,
      rows: 3,
      success: { 
          callback: function(results) {  
              //results.moves and results.seconds, but how to get the puzzle that was completed?
              alert(results.moves);
              var puzzleThatWasCompleted = ???;
          } 
      } 
    };

    $('.puzzle').jqPuzzle(settings);  //Changing all images of class puzzle to puzzles
}
4

2 回答 2

2

如果您可以将成功函数传递给任何一个实例拼图,那么您可以将函数的不同“版本”传递给拼图的每个实例,并且每个版本都包含指示它与哪个特定实例相关的标识符. 这就是愚蠢的做法。

聪明的做法是在另一个函数内部定义成功回调,从而形成一个“闭包”。这允许成功回调在每种情况下都是相同的,但可以访问标识实例的外部变量。

对于这种方法,您的代码已经成熟,几乎不需要更改。

在您的代码的以下修改中,将一个字符串或数字传递给initializePuzzle(). 形式变量puzzleID被困在一个闭包中,并且在成功回调触发时仍然可用。

您还需要更精确地指定每个拼图的容器。类选择器.puzzle可能会处理多个元素,但更糟糕的是,每次initializePuzzle()调用它都会是相同的。因此,您需要在每次调用该函数时将唯一的 id 传递给该函数。

function initializePuzzle(puzzleID, containerSelector) {
    var settings = {
        cols: 3,
        rows: 3,
        success: {
            callback: function(results) {
                alert('PUZZLE ' + puzzleID + ': ' + results.moves);
            }
        }
    };
    $(containerSelector).jqPuzzle(settings); 
}

现在你需要做的就是调用这样的initializePuzzle()东西:

initializePuzzle('A', '#puzzle1');
initializePuzzle('B', '#puzzle2');
initializePuzzle('C', '#puzzle3');

演示

于 2012-10-20T22:22:31.080 回答
0

如果我没记错的话,您可以在回调中使用 $(this) 访问成功的拼图。(我使用您提供的示例在控制台中对其进行了测试,效果很好!)

确保为每个人提供一个 ID,以便您可以使用类似 $(this).attr('id'); 的东西来恢复它。

于 2012-10-20T21:56:32.103 回答