我为简单的拖放测验做了一个功能。一切正常,当然除了 Internet Explorer。在 Chrome 控制台中,我收到此错误:
未捕获的类型错误:无法读取未定义的属性“选项”
当我将可拖动的拖放到可放置的对象上时。我“认为”(参见下面的编辑)我知道发生错误是因为当答案正确时我返回“false”,而 false 不是恢复的合法返回语句。
我希望可拖动的 div 保持在给定位置并且不再可拖动,因此它不会返回到其起始位置。我尝试什么都不返回,返回“有效”,返回“无效”并返回真。但是除了什么都不返回之外,一切都将 div 返回到它的起始位置。
不返回任何内容会产生与上述相同的错误。我的问题是我必须返回什么而不在 Chrome 中收到错误?还是我需要改变我的功能?
这是功能
function dragAndDrop() {
//drag and drop
$('.drag').draggable({ revert: 'invalid'}); //returns this to start position when drag stops and not dropped on droppable element
$('.answer').droppable({
drop: function(event, ui) {
var target = $(this);
var targetId = target.attr('id');
ui.draggable.draggable('option', 'revert', function() {
var dragId = $(this).attr('id');
if(dragId == targetId) {
//right answer
$(this)
.offset({ top: target.offset().top, left: target.offset().left })
.draggable('destroy');
var img = $(this).find('img');
console.log(img);
$('.imageCol2 > div').each(function() {
if($(this).attr('id') == dragId) {
img
.css({ position: 'relative' })
.animate({"left": "-=px"}, "slow");
console.log($(this));
}
});
//score counter
$('span#correct').each(function(index, elem) {
var good = parseInt($(this).text()) + 1;
$(this).text( function(i,txt) {return txt.replace(/\d+/, good); });
});
return false;
}
else {
//wrong answer
//score counter
$('span#incorrect').each(function() {
var fault = parseInt($(this).text()) + 1;
$(this).text( function(i,txt) {return txt.replace(/\d+/, fault); });
});
return true;
}
});
}
});
}
请注意,仅当答案正确时才会发生错误。
编辑:
我认为错误是由于错误的return语句而发生的。但是我已将我的功能更改为以下功能。当答案正确时,我仍然会遇到同样的错误。
function dragAndDrop() {
//drag and drop
$('.drag').draggable({ revert: 'invalid'}); //returns this to start position when drag stops and not dropped on droppable element
$('.answer').droppable({
drop: function(event, ui) {
var target = $(this),
targetId = target.attr('id'),
drag = $(ui.draggable),
dragId = drag.attr('id');
if(dragId == targetId) {
//right answer
//score counter
$('span#correct').each(function() {
var good = parseInt($(this).text()) + 1;
$(this).text( function(i,txt) {return txt.replace(/\d+/, good); });
});
drag
.offset({ top: target.offset().top, left: target.offset().left })
.draggable('destroy');
var img = drag.find('img');
$('.imageCol2 > div').each(function() {
if($(this).attr('id') == dragId) {
img
.css({ position: 'relative' })
.animate({"left": "-=px"}, "slow");
}
});
}
else {
//wrong answer
//score counter
$('span#incorrect').each(function() {
var fault = parseInt($(this).text()) + 1;
$(this).text( function(i,txt) {return txt.replace(/\d+/, fault); });
});
drag.draggable('option', 'revert', true);
}
}
});
}
我想我必须将我的问题改为“我做错了什么?”。