我正在尝试尽可能多地了解 jquery,查看网络上的许多示例,但仍然遇到事件问题。
如您所见,我使用 jquery UI 做了一个简单的拖放操作,但我发现的所有示例都无法帮助我验证这一点。
我创建了正确的答案,但问题是我不知道如何验证它们。很容易看出,“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();
};
最佳答案
试试这个代码:
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();
};
});
这里是 fiddle http://jsfiddle.net/aanred/x3jF3/ 。但这段代码只有基本功能,您需要改进它。
关于javascript - 基于拖放项目的 jquery 验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13615567/