1

JSON からのコンテンツで満たされたいくつかのリスト項目を ul-item に挿入しようとしていますが、それを正しく行うことができず、何が間違っているのかわかりません。

これは私が使用しているコードです:

var over_slide = $('<div id="slider" class="slider"></div>');

over_slide.append('<ul class="orslider">');

$.each(jsonobject, function (index, d) {
    if (d.category_id == 5) {
        over_slide.append("<li><h1 class='cufon'>" + d.naam + "</h1><h2 class='cufon'>" + d.subtekst + "</h2><p>" + d.tekst + "</p></li>");
    }
});

over_slide.append('</ul>');

ページにアクセスしたときにソースを調べると、適切なクラス名を持つ空の ul があり、すべてのリスト項目が ul の外側に配置されています。どうすればこれを修正できますか? いろいろ試しましたが、まだうまくいきません。

4

1 に答える 1

3

生成されliた とそのコンテンツは、divではなく に追加されていliます。

var over_slide = $('<div id="slider" class="slider"></div>');

var ul = $('<ul/>', {"class":"orslider"};  //create new ul object

$.each(jsonobject, function(index, d){    
     if(d.category_id == 5){
         //append elements to the ul instead of the div
         ul.append("<li><h1 class='cufon'>"+d.naam+"</h1><h2 class='cufon'>"+d.subtekst+"</h2><p>"+d.tekst+"</p></li>"); 
     }
});
over_slide.append(ul);
//at somepoint over_slide needs to be appended to the DOM

より良いパフォーマンスのために

var over_slide = $('<div id="slider" class="slider"></div>');

var ul = $('<ul/>', {"class":"orslider"};  //create new ul object
var html = "";
$.each(jsonobject, function(index, d){    
     if(d.category_id == 5){
         //append elements to var
         html += "<li><h1 class='cufon'>"+d.naam+"</h1><h2 class='cufon'>"+d.subtekst+"</h2><p>"+d.tekst+"</p></li>"; 
     }
});

//only perform append once
ul.append(html);

over_slide.append(ul);
//at somepoint over_slide needs to be appended to the DOM
于 2013-07-24T09:05:24.607 に答える