Question

我想在列表视图中显示子标签。在该列表视图中，我将父标记添加为列表分隔符。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<page count="89" name="Sample">
  <sections>
    <section count="3" name="Alphabets" order="1">
      <content file="220993.txt" order="1">A</content>
      <content file="220994.txt" order="2">B</content>
      <content file="220995.txt" order="3">C</content>
    </section>
    <section count="5" name="Numbers" order="2">
      <content file="221006.txt" order="4">five</content>
      <content file="221007.txt" order="5">four</content>
      <content file="221008.txt" order="6">three</content>
      <content file="221009.txt" order="7">two</content>
      <content file="221010.txt" order="8">one</content>
    </section>
    <section count="2" name="Names" order="3">
      <content file="221013.txt" order="9">Sam</content>
      <content file="221014.txt" order="10">Sansha</content>
    </section>
  </sections>
</page>

代码：

$(xml).find('section').each(function () {
                var section = $(this).attr("name");
                var count = $(this).attr('count');
                var order = $(this).attr('order');
                $(this).children().each(function () {
                    var content = $(this).text();

                    var order = $(this).attr("order");
                    var seq = order + '' + $(this).attr('order');

                        $("#section_list").append('<li data-role="list-divider">' + section + '</li>');
                        $("#section_list").append('<li><a href="" class="style1" data-sequence="s' + seq + '" ><h2>' + content + ' </h2></a></li>');    
                        $("#section_list").listview('refresh');

                });
            });

如果我这样做，那么每个孩子都会重复这个父标记。

与list-divider一起使用。我正在显示列表视图中每个项目的描述。但这些描述来自每个项目的相关文件。当我使用list-divider以及说明显示列表视图时，我遇到了问题，然后列表视图显示为所有分隔符应该首先和下面组合，列表中的项目将显示。如何正确显示列表视图和描述。

http://jsfiddle.net/2YbT5/

先谢谢。

Answer 1

Demo

试试这段代码..

$(xml).find('section').each(function () {
  var section = $(this).attr("name");
  var count = $(this).attr('count');
  var order = $(this).attr('order');
  $("#section_list").append('<li data-role="list-divider">' + section + '</li>');
  $(this).find('content ').each(function () {
     var content = $(this).text();
     var order = $(this).attr("order");
     var seq = order + '' + $(this).attr('order');
     $("#section_list").append('<li><a href="" class="style1" data-sequence="s' + seq + '"  ><h2>' + content + ' </h2></a></li>');    
     });
});

如何使用jquery在xml文件的父级下显示子级？

1 个答案: