jquery 未捕获类型错误 : Cannot read property 'options' of undefined (edited)

标签 jquery function return draggable droppable

我制作了一个用于简单拖放测验的功能。当然,除了 Internet Explorer 之外,一切都工作正常。在 Chrome 控制台中我收到此错误:

Uncaught TypeError: Cannot read property 'options' of undefined

当我将可拖动对象放到可放置对象上时。我“认为”(参见下面的编辑)我知道发生错误是因为当答案正确时我返回“false”,而 false 不是用于恢复的合法返回语句。

我希望可拖动的 div 保持在给定位置并且不再可拖动,因此它不会返回到其起始位置。我尝试不返回任何内容,返回“有效”,返回“无效”并返回 true。但除了不返回任何内容之外,所有内容都会将 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);
            }
        }
    });
}

我想我必须将问题改为“我做错了什么?”。

最佳答案

我找到了问题的答案。

我将 .('destroy') 更改为 .('disable')。这样就解决了出现错误的问题。

关于jquery 未捕获类型错误 : Cannot read property 'options' of undefined (edited),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16581641/

相关文章:

C 递归函数不会返回 true

arrays - 如何从 Golang 中的不同函数将一个数组的元素复制到另一个数组

javascript - 如何使用ajax将数据附加到特定帖子?

python-3.x - 应用通用函数 (x,y) 从两个现有列创建一个新列,以便我可以在不同列中使用该函数

javascript - 如何确保特定的单击事件处理程序在所有其他附加的单击处理程序之后执行?

java - 获取日期差异的返回值?

javascript - 如果另一个元素包含带有 jQ​​uery 的字符串,则隐藏特定元素

jquery - jQuery 'Dropdown' 的 CSS 帮助

javascript - 这是一个错误吗?请检查一下

c++ - 简单的c++输入函数