Javascript 在jquery中使用拖放，无法获得正确答案

嗨，这是我第一次发帖，所以如果我错过了什么，请道歉。 我试图做的是随机排列一组字符串，然后让用户将它们放入正确的框中。我已经完成了随机化，但我无法找出允许用户将其放置在正确位置的代码。我可以让他们投进任何一个盒子，也可以一个都不投 我不是程序员，这是关于学习的最后一篇论文的一部分，所以我尽量保持它的简单 这是我的剧本。提前感谢：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script>
<script type="text/javascript">

var correctCards = 0;
$( init );

function init() {

  // Hide the success message
  $('#successMessage').hide();
  $('#successMessage').css( {
    left: '580px',
    top: '250px',
    width: 0,
    height: 0
  } );

  // Reset the game
  correctCards = 0;
  $('#wordPile').html( '' );
  $('#cardSlots').html( '' );

  // Create the pile of shuffled words
  var newwords = [ 'me', 'you', 'him', 'her','it','them', 'those', 'test', 'apple', 'orange'];
  newwords.sort( function() { return Math.random() - .5 } );


  for ( var i=0; i<10; i++ ) 
  {
    $('<div>' + newwords[i] + '</div>').data( 'right', newwords[i] ).attr( 'id', 'card'+newwords[i] ).appendTo( '#wordPile' ).draggable( {
      containment: '#content',
      stack: '#wordPile div',
      cursor: 'move',
      revert: true
    } );
  }

  // Create the word slots
  var words = [ 'me', 'you', 'him', 'her','it','them', 'those', 'test', 'apple', 'orange'];
  for ( var i=1; i<=10; i++ ) 
  {
    $('<div>' + words[i-1] + '</div>').data( 'right', i ).appendTo( '#cardSlots' ).droppable( {
      accept: '#wordPile div',
      hoverClass: 'hovered',
      drop: handleCardDrop
    } );
  }

}

function handleCardDrop( event, ui ) {
  var slotNumber = $(this).data( 'right' );
  var cardNumber = ui.draggable.data( 'right' );

  // If the card was dropped to the correct slot,
  // change the card colour, position it directly
  // on top of the slot, and prevent it being dragged
  // again

  if ( slotNumber == cardNumber ) {
    ui.draggable.addClass( 'correct' );
    ui.draggable.draggable( 'disable' );
    $(this).droppable( 'disable' );
    ui.draggable.position( { of: $(this), my: 'left top', at: 'left top' } );
    ui.draggable.draggable( 'option', 'revert', false );
    correctCards++;
  } 

  // If all the words  have been placed correctly then display a message
  // and reset the cards for another go

  if ( correctCards == 10 ) {
    $('#successMessage').show();
    $('#successMessage').animate( {
      left: '380px',
      top: '200px',
      width: '400px',
      height: '100px',
      opacity: 1
    } );
  }

}

</script>

var=0；
美元（初始）；
函数init（）{
//隐藏成功消息
$（'successMessage'）.hide（）；
$（'successMessage'）.css（{
左：‘580px’，
顶部：'250px'，
宽度：0，
身高：0
} );
//重新设置游戏
校正卡=0；
$（'#wordPile'）.html（''）；
$（'#cardSlots'）.html（''）；
//创建一堆混乱的单词
var newwords=[‘我’、‘你’、‘他’、‘她’、‘它’、‘他们’、‘那些’、‘测试’、‘苹果’、‘橙色’]；
sort（函数（）{return Math.random（）-.5}）；
对于（var i=0；i您是否想过将代码包装到dom就绪事件中：

 $(function(){
    //script here
 });

或

这似乎没有什么区别，我可能应该更清楚一些，代码在我拖放之前一直运行得很好。我认为问题出在：.data（'number'，I.）部分，但无法找到解决方案。这有什么区别吗（真正的问题，不是讽刺：）好的，建议您及时更新库和框架：错误修复、新功能、弃用函数……1.5远远落后于jQuery开发。好的，谢谢。这是我正在修改的代码，所以可能比我想象的要旧
$(document).ready(function(){
   //script here
});