0

我在尝试使此代码正常工作时遇到了麻烦。我真的看不出javascript有什么问题。当我调试时,我也没有发现错误。

<head>
<style type="text/css">
</style>
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
 $(document).ready(function() {
$('#Presentation').click(function() {
var jsonloc = "ppt.json";
        $.when($.getJSON(jsonloc)).then(function(info){
        $('#header').empty();
            $.each(info.slides, function(entryIndex, entry){
            var html = '<div class="info">';                      
            html += '<h3>' + entry['title'] + '</h3>';
            html += '<div class="author">' + entry['author'] + '</div>';                    
                if(entry['slides']){
                    $.each(entry['slides'],function(slideIndex, slides){
                        html += '<h3>' + slides['Slide'] + '<h3>';                                          
                        html += '<div class="header">' + slides['header'] + '</div>';                          
                        }); 
                if(slides['Content']){
                html += '<div class="Content">';                                            
                html += '<ol>';
                    $.each(slides['content'],function(contentIndex, content){
                        html += '<li>' + content + '</li>';                        
                            }); 
                        html += '</ol>';                        
                        html += '</div>';                               
                    };                                  
                $('#header').append(html);
            };                         
        });
        return false;
    });
    });

});
</script>
</head>
<body>

<a href="#" id="Presentation">ppt presentation</a>
<div id="header">
</div>
</body>

这是JSON:

{
    "title": "presentation",
    "date_created": "",
    "last_modified": "",
    "author": "By: Someone online",
    "slides": [
        {
            "Slide": "1",
            "header": "first header",
            "src": "ssss.jpg",
            "Content": "dddddddddddddddddddddddddddddddddddd",
            "Content": "dddddddddddddddddddddddddddddddddddd",
            "Content": "dddddddddddddddddddddddddddddddddddd"
        },
        {
            "Slide2": "2",
            "header2": "header 2",
            "src2": null,
            "Content": "dddddddddddddddddddddddddddddddddddd",
            "Content": "dddddddddddddddddddddddddddddddddddd",
            "Content": "dddddddddddddddddddddddddddddddddddd"

        },
        {
            "Slide3": "3",
            "header3": "header3",
            "src3": "sdfdsf.jpg",
            "Content": "dddddddddddddddddddddddddddddddddddd",
            "Content": "dddddddddddddddddddddddddddddddddddd",
            "Content": "dddddddddddddddddddddddddddddddddddd"
        }
    ]
}

我真的很想完成这项工作,并且不想使用其他方法,例如 jquery 模板。有什么东西会跳出来吗?

4

1 回答 1

1

你关闭.each得太早了:

$.each(entry['slides'],function(slideIndex, slides){
    html += '<h3>' + slides['Slide'] + '<h3>';                                          
    html += '<div class="header">' + slides['header'] + '</div>';                          
 }); 
 if(slides['Content']){ 
 // ...

这样您只能访问slides['Content'].

您需要将其if及其包含的内容放入循环中,如下所示:

 $.each(entry['slides'],function(slideIndex, slides){
    html += '<h3>' + slides['Slide'] + '<h3>';                                          
    html += '<div class="header">' + slides['header'] + '</div>';      
    if(slides['Content']){
    // ...

 }); 
于 2013-01-16T02:02:11.067 回答