ビューを変更するJQueryモバイル

Question

私は$ eachで得られた配列の値を取得し、ビューを変更しようとしています。もう一方のビューには、他のビューで選択したテキストが含まれていなければなりません。私は値を比較する必要があると思うが、私は方法を知らない。

タイトルリストビューのHTML

<div class="example-wrapper" data-iscroll> 
    <ul data-role="listview" id="listados" > 
    </ul> 
</div> 

私はwww.healthcare.gov/api/blog.jsonのAPIを取得してい

<div data-role="page" id="hcabecera"> 
    <div id="noticia"> 
    </div> 
</div> 

コンテンツビューのHTML

$(document).on('pageinit', '#home', function() { 
    $.getJSON('https://www.healthcare.gov/api/blog.json', function(datos) { 
    $.each(datos.blog, function(i, value) { 
     if (value.lang == 'es') { 
     $('#listados').append('<li><a>' + value.title + '</li></a>'); 
     $('#listados').listview('refresh'); 
     } 
    }); 
    $("#listados li").on('click', function() { 
     $.mobile.changePage("#hcabecera", { 
     transition: "slide", 
     changeHash: false 
     }); 
     $("#noticia").append(datos.blog.content); 
    }); 
    }); 
}); 

Answer 1

あなたのコードを実際のソリューションに修正しました：https://jsfiddle.net/ss77uvsp/3/

必要な情報を収集するためには、少し異なる方法で反復する必要があります。次に、各反復の後、結果を評価し、リストに追加します。これは少なくとも1つの方法です。

"hcabecera"ページでは、各タイトルを対応するテキストにリンクする方法を見つける必要があります。一度にすべてのコンテンツを追加して非表示にしてから、識別タグに基づいて要求セットのコンテンツを表示することをお勧めします。

var title = "", lang = "", content = "", id = 1; 

$.getJSON('https://www.healthcare.gov/api/blog.json', function(datos) { 
    $.each(datos.blog, function() { 
    $.each(this, function(i, value) { 
     //The title appears before the language tag, so we need to save it temporarily 
     if(i == "title") 
     title = value; 
     //Language 
     if(i == "lang") 
     lang = value; 
     //Content 
     if(i == "content") 
     content = value; 
    }); 
    //Check that the language is correct 
    if(lang == "en"){ 
     //Append title to list 
     $('#listados').append('<li data-no="'+id+'"><a>' + title + '</li></a>'); 
     //Append content to page hcabecera 
     $("#noticia").append('<div id="item-'+id+'" class="items">'+content+'</div>'); 
     id++; 
    } 
    }); 
    //Refresh list 
    $('#listados').listview('refresh'); 

    //List item click event 
    $("#listados li").on('click', function() { 
    //Get div ID 
    var no = $(this).attr("data-no"); 
    $(".items").hide(); 
    $("#item-"+no).show(); 
    $.mobile.changePage("#hcabecera", { 
     transition: "slide", 
     changeHash: false 
    }); 
    }); 
});