Question

我只是想获取$ each获得的数组的值并更改视图。另一个视图必须包含我在另一个视图中选择的文本并将其打印出来。我想我需要对价值进行比较，但我不知道如何。

标题列表视图的HTML

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

内容视图的HTML

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

我正在接受www.healthcare.gov/api/blog.json的api

$(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/

您需要以稍微不同的方式进行迭代才能收集所需的信息。然后，在每次迭代之后，评估结果并附加到列表。这至少是一种方法。

对于“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
    });
  });
});

更改视图JQuery mobile

1 个答案: