1

編集: ブランドンの例のおかげで、最新の 10 項目を取得できました。しかし今、別のことが起こります。10 個のアイテムのみを読み込むコードを追加する前は、アイテムをクリックすると、クリックしたアイテム以外のすべてが非表示になり、それに接続されているビデオが表示されました。コードを追加したので、アイテムをクリックしてもコンテンツが表示されなくなりました。閉じタグが間違っているのか、何か原因なのか調べてみたのですが、よくわかりません。

というわけでfunction itemClick(){パートから。

これが私のスクリプトです：

$(document).ready(function(){
        $.ajax({
            type: "GET",
            url: "http://www.flabber.nl/rss/nakko/webzap",
            dataType: "xml",
            success: function(xml) {
            var $items = $(xml).find('item');
                for(var i = 0; i < $items.length && i < 10; i++){
                var myObj = $items.eq(i);
                    var urllist = myObj.find('link').text();
                    var node = urllist.substring(urllist.lastIndexOf('-')+1);
                    var id = node;
                    var video5 = myObj.find('hosted-video-url').text();
                    var playvid5 = "playVideo('video5')";
                    playvid5 = playvid5.replace("video5", video5);
                    var title = myObj.find('title').text();
                    var url = myObj.find('link').text();
                    var brief = myObj.find('teaser').text();
                    var long = myObj.find('lees-verder').text();
                    var ytube = "";
                    var src = myObj.find('iframe').attr('src');
                    var match = /embed\/([A-Za-z0-9_]+)/.exec(long);
                    if(match) ytube = match[1]; // Found it!
                    var playytube = "playVideo('http://www.youtube.com/watch?v=ytube')";
                    playytube = playytube.replace("ytube", ytube);
                    var pubDate = myObj.find('pubDate').text();
                    var img = myObj.find('image').text();
                    $('<p class="items" class="click_'+id+'" id="link_'+id+'" style="width:100%"></p>').appendTo('.class2');
                    $('<div class="terug" style="margin-bottom: 1px; margin-left: 1%"><img src="images/terug.png"></div>').appendTo('#link_'+id);
                    $('<h2 class="title_list" style="padding-top: 10px; border-top: 1px solid #72b252;"></h2>').html(title).appendTo('#link_'+id);
                    $('<div class="introtekst"><a href="#"></a></div>').html(brief).appendTo('#link_'+id);
                    $('<div class="screenshot"></div>').html('<img src="'+img+'" height="120"/>').appendTo('#link_'+id);
                    $('<h2 class="title"></h2>').html(title).appendTo('#link_'+id);
                    $('.terug').hide();

                        function itemClick(){
                    $('.items').hide();
                        $('.terug').show();
                        $('#link_'+id).unbind('click');
                        $('<div class="introtekst_gal"><a href="#"></a></div>').html(brief).appendTo('#link_'+id);
                        $('<div class="html5vid"></div>').html('<a href="#" onclick="'+playvid5+'"><img src="'+img+'" style="margin-bottom: 20px;"/><div class="play"><img src="images/play.png" /></div></a>').appendTo('#link_'+id);
                        $('<div class="content"></div>').html('<a href="#" onclick="'+playytube+'"><img src="'+img+'" style="margin-bottom: 20px;"/><div class="play"><img src="images/play.png" /></div></a>').appendTo('#link_'+id);
                        $('<div class="openbrowser" id="link_'+id+'"></div>').html('<a href="'+url+'"><img src="images/naarf.png" /></a>').appendTo('#link_'+id);   
                        $(this).toggle();
                        if (video5 == ""){
                                                $('.html5vid').remove();
                                                $('.screenshot').hide();
                        }
                        else {
                                                $('.content').remove();
                                                $('.screenshot').hide();                                                    
                        }
                        };



                    $('#link_'+id).bind('click', itemClick);                        

                    $('.terug').mousedown(function(){
                    $(".items , .screenshot").show();                       
                    $(".content , .openbrowser , #videoplayer-0 , #videoplayer-1 , .html5vid , .introtekst_gal" ).remove();
                    $(".terug").hide();
                    $('#link_'+id).bind('click', itemClick);                                                                        

                    });

                    document.addEventListener("backbutton", function () {   
                        $(".items , .screenshot").show();
                        $(".content , .openbrowser , #videoplayer-0 , #videoplayer-1 , .html5vid , .introtekst_gal").remove();
                        $(".terug").hide();
                        $('#link_'+id).bind('click', itemClick)
                    }, false); 

                };


            }

        }); 

    });
4

1 に答える 1

1

返されるXMLを制御できる場合は、返されるアイテムの量を制限することをお勧めします。10個必要なときにn個すべてのアイテムを転送する必要がないため、パフォーマンスが向上します。

それが不可能な場合は、処理されるアイテムの数を制限するには、従来のforループで十分です。

//...            
success: function(xml) {
    var $items = $(xml).find('item');
    for(var i = 0; i < $items.length && i < 10; i++){
        var myObj = $items.eq(i);
        var urllist = myObj.find('link').text();
        var node = urllist.substring(urllist.lastIndexOf('-')+1);
        var id = node;
        var video5 = myObj.find('hosted-video-url').text();
        var playvid5 = "playVideo('video5')";
        //...
    }
}
//...

</ p>

于 2012-04-10T11:48:08.680 に答える