无法识别的表达

时间:2012-01-21 11:45:48

标签: javascript jquery html

我有来自webservice的以下json输出:

[
{
    "subCategories": [
    {
        "subCategories": [],
        "menuItems": [],
        "id": 2,
        "title": "First Course",
        "type": "Menu Section",
        "categoryID": 9,
        "isActive": true,
        "orderIndex": 7
    }, {
        "subCategories": [],
        "menuItems": [
        {
            "id": 0,
            "price": 30,
            "title": "Meat",
            "ingredients": "Bread, Pate, Cilantro, Turkey.",
            "cookingTimeInMinutes": 6,
            "isActive": true,
            "picture": "",
            "categoryID": 3,
            "orderIndex": 2
        }],
        "id": 3,
        "title": "Banh Mi",
        "type": "Food Item",
        "categoryID": 9,
        "isActive": true,
        "orderIndex": 1
    }],
    "menuItems": [
    {
        "id": 1,
        "price": 1,
        "title": "Soup",
        "ingredients": "Water, Good Stuffs, Noodles.",
        "cookingTimeInMinutes": 10,
        "isActive": true,
        "picture": "",
        "categoryID": 9,
        "orderIndex": 4
    }, {
        "id": 3,
        "price": 12,
        "title": "Egg Sandwich",
        "ingredients": "Egg, Sandwich",
        "cookingTimeInMinutes": 6,
        "isActive": true,
        "picture": "",
        "categoryID": 9,
        "orderIndex": 3
    }],
    "id": 9,
    "title": "Lunch",
    "type": "Menu Section",
    "categoryID": null,
    "isActive": true,
    "orderIndex": 0
}, {
    "subCategories": [],
    "menuItems": [],
    "id": 7,
    "title": "Snack",
    "type": "Menu Section",
    "categoryID": null,
    "isActive": true,
    "orderIndex": 8
}, {
    "subCategories": [],
    "menuItems": [],
    "id": 6,
    "title": "First Course",
    "type": "Menu Section",
    "categoryID": null,
    "isActive": true,
    "orderIndex": 5
}, {
    "subCategories": [],
    "menuItems": [
    {
        "id": 2,
        "price": 3,
        "title": "Salad",
        "ingredients": "Veggies",
        "cookingTimeInMinutes": 5,
        "isActive": true,
        "picture": "",
        "categoryID": null,
        "orderIndex": 9
    }],
    "id": -1,
    "title": "Other",
    "type": "Menu Section",
    "categoryID": null,
    "isActive": true,
    "orderIndex": 1000
}]

我有以下javascript片段应该迭代提到的json并将其转换为div:

<script type="text/javascript">
    /* wait until the document has finished loading before loading
     * the rest of the content
     */
    $(document).ready(function(){
        function divifyCategory(containerID, gingerWebCategory){
            $('#' + containerID).append(
                $('<div class="category" id="' + gingerWebCategory.id + '">' + gingerWebCategory.title + '</div>')
            );
            for(menuItem in gingerWebCategory.menuItems){
                $('.category#' + gingerWebCategory.id).append(
                    $('<div class="menuItem" id="' + menuItem.id + '">' + menuItem.title + '</div>')
                );
            }
        }

        // load menu from web service
        $.get('http://localhost:50730/GingerWeb.asmx/getMenu', function(data){
            var data = eval(data);
            for(var i=0; i<data.length; i++){
                divifyCategory(data[i]);
            }
        });
    });
</script>

了解我在Chrome中收到此错误消息的原因:

  

未捕获错误:语法错误,无法识别的表达式:#[object   对象

2 个答案:

答案 0 :(得分:1)

您的json对象是一个对象数组。当您传递data [i]时,您将传递数组中的第一个元素,一个对象,并将其视为字符串(containerID)。你需要从你传递的对象中获取ID。

答案 1 :(得分:1)

我认为data是帖子开头提到的json字符串。 data是一个对象数组。那么

for(var i=0; i<data.length; i++){ divifyCategory(data[i]); }

对象已传递给函数divifyCategory,它将字符串作为第一个参数。并且该参数像字符串一样使用

$('#' + containerID)

在运行时中获得$('#[object Object]')。这是不可预见的情况。

我希望它有所帮助。