基於拖放項目的jquery驗證

Question

我試圖儘可能多地瞭解jquery，在網絡上查看很多示例，但仍遇到事件問題。你可以看到，我做了一個簡單的拖動使用jQuery UI的東西，但我發現的所有例子arround沒有幫助我驗證這一點。

我創建了correctAnswers但問題是我不知道如何驗證它們。很容易看出，'a'變爲1，'b'變爲2，'c'變爲3，當我點擊'提交'按鈕時，它會驗證。

var correctAnswers = ['a-1,b-2,c-3']; 

$('.dragAble').draggable({ 
    containment: "#content", 
    cursor: "move", 
    snap: ".dropAble" 
}); 
if (answers === correctAnswers) { 
    $("#win").show(); 
} else { 
    $("#fail").show(); 
};​ 

JSFiddle

Answer 1

試試這個代碼：

var correctAnswers = ['a-1', 'b-2', 'c-3']; 
var results = []; 

$('.dragAble').draggable({ 
    containment: "#content", 
    cursor: "move", 
    snap: ".dropAble", 
}); 

$(".dropAble").droppable({ 
    drop: function(event, ui) { 
     results.push($(ui.draggable).attr("id") + '-' + $(this).attr("id")); 
    } 
}); 

$("#submit").click(function(){ 
    console.log(results); 
    result = true; 
    $.each(results, function(index, value){ 
     if($.inArray(value, correctAnswers) == -1){ 
      result = false; 
     } 

     if(!result) return; 
    }); 

    if (result) { 
     $("#win").show(); 
    } else { 
     $("#fail").show(); 
    }; 
});​ 

這裏小提琴http://jsfiddle.net/aanred/x3jF3/。但是這個代碼只有基本的功能，你需要改進它。