使用拖放在jquery中，不能得到正確的答案

Question

嗨，這是我第一次發佈如此道歉，如果我錯過了什麼。 我試圖做的是隨機化一個字符串數組，然後讓用戶將它們放在正確的框中。我已經完成了隨機化，但是我無法弄清楚允許用戶將它放在正確位置的代碼。我可以得到它，他們可以放在任何箱子裏，或根本沒有 我不是程序員，這是學習的最後一篇論文的一部分，所以我試圖保持簡單 這裏是我的腳本。在此先感謝：

<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> 

Answer 1

你有沒有想過在DOM已準備就緒事件包裝代碼：

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

或

$(document).ready(function(){ 
    //script here 
});