2

我正在自学 javascript/jquery，并决定作为一个辅助项目来创建拖放游戏。我已经根据我发现的其他教程进行了修改，并对其进行了真正的调整，所以在代码上放轻松——希望它不会太吓人。

我正在使用 jquery ui dropable 库来实现游戏，目前我检查一旦项目被丢弃是否在正确的位置，如果是，我将分数加一。

但是我遇到的问题是，当物品掉到错误的地方时，我无法让分数下降一分。

如果将一个正方形放置在正确的占位符上，它会将分数加 1，但如果从正确的占位符中删除同一个正方形，则它需要从分数中减去 1。

这是我到目前为止所做的演示 http://creativelabel.co.uk/drag-and-drop/

有任何想法吗？

4

2 回答 2

1

解决此问题的一种方法是在放置的元素中存储它是否放置在有效的正方形中。这意味着当它移动到无效方格时，您可以检查它以前是否在有效方格中，如果是这种情况，则将分数减一。

希望这很清楚！

有关现场演示，请参见http://jsfiddle.net/pET3y/

相关代码：

  if ( slotNumber == imgNumber ) {
    ui.draggable.addClass( 'img-match' );
    ui.draggable.data("valid", true);

    imgMatch++;
  }  else {
      if(ui.draggable.data("valid")) {
         imgMatch--;
         ui.draggable.data("valid", false); 
      }
  }

alert(ui.draggable.data("valid"));注意：小提琴有调试警报

--

更改为拖动分数下降

您现在要做的是监听拖动事件（称为activate），并在调用该事件时运行一个函数。该函数检查被拖动的元素之前是否处于正确的位置，如果是，则将其标记为不在正确的位置并降低分数。

见：http: //jsfiddle.net/3NkwJ/1/

      drop: handleDropEvent,
      activate: handleDragEvent //add new event
} );

并添加以下内容：

  function handleDragEvent( event, ui ) {
    if(ui.draggable.data("valid")) {
             imgMatch--;
             $('input[name=Score]').val(imgMatch);
             $('#score h1').text(imgMatch);
             ui.draggable.data("valid", false); 
    }      
  }
于 2012-09-05T15:19:21.233 回答
0

我只浏览了代码，但在这个块之后

if ( slotNumber == imgNumber ) {
    ui.draggable.addClass( 'img-match' );
    imgMatch++;
}

你能添加一个 else 语句吗

else
    imgMatch--;
于 2012-09-05T15:19:34.067 回答