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 に答える