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

Question

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

我已经发布了我正在做的工作的 JSFiddle 版本，然后我在 GitHub 中发布了另一个版本，该版本抛出错误。除了它指向外部文档的位置之外，功能是相同的。然而，在我的 Github 完整版本上，我收到错误“Uncaught TypeError:无法读取未定义的属性‘长度’”。阅读其他人的问题，似乎对象没有正确转换，但如果是这样的话，我不知道为什么它在 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 属性，您的问题很可能与您调用的 AJAX 调用返回的数据有关每个。您可以通过更改 data.stuff 的名称在 jsfiddle 中轻松重现您的问题，您将收到错误: http://jsfiddle.net/7d2wqkpq/

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