0

我让一切正常，但我的表单显示未定义。我需要我的 .getJSON 函数工作。我不叫什么？或者我需要从我的 .getJSON 函数中添加或删除什么？我的 JSON 文件中的数组是：

[
    {name: enteredBy, text: entryText}  
]

HTML

<!DOCTYPE html>
<html>
    <head>
        <title>Blog Demo</title>
        <style>
            .control {
                margin-bottom:10px;
            }

            .control label {
                display:block;
                margin-bottom:3px;
            }

            table {
                border:1px solid #000;
                background-color:#FFFED1;
                width:500px;
            }

            table caption {
                border-top:1px solid #000;
                border-left:1px solid #000;
                border-right:1px solid #000;
                font-size:1.5em;
                background-color:#466180;       
                color:#fff;
                line-height:1.5em;
                padding:5px;                
            }

            table thead {
                background-color:#AAECC2;
            }

            table tbody {
                margin-top:15px;                
            }

            table tbody td {
                background-color:#fff;
            }           

        </style>
    </head>
    <body>      
        <div>
            <div class="control">
                <label for="enteredBy">Entered By</label>
                <input type="text" id="enteredBy"/>
            </div>
            <div class="control">
                <label for="blogEntry">Blog Entry</label>
                <textarea id="blogEntry" cols="50" rows="5"></textarea>
            </div>
            <div class="control">
                <button id="postEntry">Post</button>        
            </div>
        </div>
        <table>
            <caption>
                Blog Entries
            </caption>
            <thead>
                <tr>
                    <th>Entered By</th>
                    <th>Entry</th>
                </tr>
            </thead>
            <tbody>
            </tbody>
        </table>
        <script src="scripts/jquery-1.10.2.min.js"></script>
        <script>
            $(function() {
                var blogEntries = [];


                $("#postEntry").click(function() {

                    var enteredBy = $("#enteredBy").val();
                    var entryText = $("#blogEntry").val();



                    $.getJSON(
                    'entries.js',
                    function(allBlogEntries) {
                        blogEntries=getBlogEntriesForName(blogEntriesForName, allBlogEnries);
                        displayBlogEntries(blogEntries);

                    }

                    );


                blogEntries.push(blogEntry);    

                    // Now display the blog entries
                    displayBlogEntries();                   
                });

                function displayBlogEntries() {
                    var tableRows = "";

                    //TODO: Loop through the blogEntries array. For each item in the array create an HTML table row.


                        $.each(blogEntries, function(key, value) {
                        var tableRow = "<tr>";
                        tableRow += "<td>" + value.name + "</td>";
                        tableRow += "<td>" + value.text + "</td>";
                        tableRow += "</tr>";

                        tableRows += tableRow;
                    });
                    $("table tbody").html(tableRows);
                }
            });


        </script>
    </body>
</html>
4

0 回答 0