如何在游戏结束时获得一个 jquery 警报？答案

【问题标题】：How do I get one jquery alert at the end of the game?如何在游戏结束时获得一个 jquery 警报？
【发布时间】：2014-05-09 18:48:19
【问题描述】：

此代码用于拖放游戏。目前，警报（“正确”）在每个不同的部分被拖到其目标后出现。如何更改此设置，以便在游戏结束时仅出现一次警报，说明有多少是正确的？

html:

<img class="drag-me" id="drag1" src="images/drag1.png">
<img class="drag-me" id="drag2" src="images/drag2.png">
<img class="drag-me" id="drag3" src="images/drag3.png">
<img class="drag-me" id="drag4" src="images/drag4.png">

<img class="target" id="target1" src="images/target1.png">
<img class="target" id="target2" src="images/target2.png">
<img class="target" id="target3" src="images/target3.png">
<img class="target" id="target4" src="images/target4.png">

jquery：

$('.drag-me').draggable({revert:"invalid", snap:".target"});
$('.target').droppable({
    drop: function( event, ui ) {
      itemsInPosition++;
      // get id of draggable and droppable id
      var draggableID = $(ui.draggable).attr("id");
      var droppableID = $(this).attr("id");
      if(draggableID[4]==droppableID[6]){
        alert("correct")
    testIfComplete();
        totalCorrect++;
      }
    }
});

var itemsInPosition = 0;
var totalItems = 4;
var totalCorrect = 0;

function testIfComplete(){
if(itemsInPosition==totalItems){
alert("You got " + totalCorrect + " right")
  }
}

谢谢！

【问题讨论】：

标签： javascript jquery html drag-and-drop drag

【解决方案1】：

可能，你应该选择合适的库：JS+CSS for jquery UI。

看这个fiddle。有用。 http://jsfiddle.net/abdennour/67SrS/

var itemsInPosition = 0;
var totalItems = 4;
var totalCorrect = 0;
$('.drag-me').draggable({revert:"invalid", snap:".target"});
$('.target').droppable({
    drop: function( event, ui ) {
      itemsInPosition++;
      // get id of draggable and droppable id
      var draggableID = $(ui.draggable).attr("id");
      var droppableID = $(this).attr("id");
      if(draggableID[4]==droppableID[6]){
        alert("correct")
    testIfComplete();
        totalCorrect++;
      }
    }
});

你可以从这个小提琴中总结并下载合适的库：

http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/themes/overcast/jquery-ui.css

【讨论】：