新到 json/ajax .. 控制台错误是 Uncaught TypeError: Cannot read property 'length' of undefined

Question

我的代码有问题。请注意，我对此完全陌生，所以如果解决方案很简单，请原谅我。在发布之前我确实尝试过找到解决方案，并且我发现很多帖子都有类似的控制台错误，但是没有一个与我的问题有关（或者我只是不太了解它）。

我已经发布了我正在做的工作的 JSFiddle 版本，然后是我在 GitHub 中的另一个抛出错误的版本。除了它指向外部文档的位置之外，功能是相同的。然而，在我的 Github 完整版中，我收到一个错误“未捕获的类型错误：无法读取未定义的属性‘长度’”。阅读其他人的问题，似乎对象没有正确转换，但如果是这种情况，我不知道为什么它在 JSFiddle 中有效。

这里是 js 代码的片段。

$(document).ready(function() {

        $( "#sortable1, #sortable2, #sortable3" ).sortable({
      connectWith: ".connectedSortable"
    }).disableSelection();


    //Some code
    $("#sortable3").sortable();
    //Some more code
    $("#addStuff").click(function(e) {
        e.preventDefault();
        var itemSelector = $("#myList li"),
            items = [],
            dataObj = {};
        $.each(itemSelector, function(i, v) {
            items.push($(v).val());
        });
        //I Am Sure There Is A Better Way Of Sending Checked Items Than A Ton Of IF Statements, However This Works..
        if(document.getElementById('bacon').checked) {
            items.push($("#bacon").val());
        }        
        if(document.getElementById('bananapeppers').checked) {
            items.push($("#bananapeppers").val());
        }          
        if(document.getElementById('blackolives').checked) {
            items.push($("#blackolives").val());
        }        
        if(document.getElementById('greenpeppers').checked) {
            items.push($("#greenpeppers").val());
        }         

        dataObj.stuff = items;
        $.ajax({
            url: '/echo/json/',
            data: {
                json: JSON.stringify(dataObj)
            },
            success: function(data) {
                $("#sortable3").empty();
                $.each(data.stuff, function(k, v) {


     $("#sortable3").append("<li>" + v + "</li>");
            })
        },
        type: 'POST',
        datatype: 'json',
        cache: false
    });
});

这是有效的 JSFiddle 版本的链接： http://jsfiddle.net/1ukyLgnh/5/

这是一个无法正常工作的完整内容的 Github 存储库： https://github.com/dhierholzer/Basiconlineorderingone

如果重要的话，我会通过 WAMP 服务器对其进行测试，并通过一个名为 Light Table 的程序进行调试

最后一点，在我的 Github 版本上，我添加了一行 window.alert(dataObj.stuff);只是为了确保这些值至少传递了那么远，而且它们确实如此。任何帮助将不胜感激。

Answer 1

$.each 使用length 属性，您的问题很可能与您调用each 的AJAX 调用返回的数据有关。您可以通过更改 data.stuff 的名称轻松地在 jsfiddle 中重现您的问题，您将收到错误消息： http://jsfiddle.net/7d2wqkpq/

您的调试警报中有错误。您正在检查 dataObj 是否正常，但 dataObj 是您在 ajax 调用中发送的对象，而不是返回的对象。将alert(dataObj.stuff) 替换为alert(data.stuff)，您可能会得到未定义。从那时起，修复您的代码应该很容易。