Question

我有一个动态创建的xml文件，其中包含一个包含五个描述符字段的记录。其中一个是称为“类别”的节点。我无法在任何地方找到答案。所以，如果我有一个

的xml文件

<test>
   <name>Ferarri</name>
   <category>Cars</category>
</test>
<test>
   <name>Maserati</name>
   <category>Cars</category>
</test>
<test>
   <name>John Deere</name>
   <category>Trucks</category>
</test>
<test>
   <name>Ford F350</name>
   <category>Trucks</category>
</test>

有没有办法向用户显示类别字段名称作为列表分隔符，然后下面列出包含该类别节点的那些记录？如下。当然，CSS样式不适用于此处。

汽车 -Ferrari -Maserati 卡车 -约翰迪尔 - 福特F350

感谢您提供任何帮助/提示！

来自Neil的回答（WORKS！）：

 $(document).ready(function(){

                            $.ajax({
                                   type: "GET",
                                   url: "testlist.xml",
                                   dataType: "xml",
                                   success: function(xml) {
                                   var $body = $("#test-content");
                                   var $ul = $("#testList"); 
                                   var categories = new Object();
                                   var category;
                                   $(xml).find('test').each(function(){
                                                            category = $('category', this).text();
                                                            if (categories[category] == undefined){
                                                            categories[category] = $('name"', this).text();
                                                            } else {
                                                            categories[category] += ',' + $('name', this).text();
                                                            }
                                                            });
                                   for (category in categories) {
                                   $body.append('<h1>' + category + '</h1>');
                                   var vehicles = categories[category].split(',');
                                   $ul = $body.append('<ul></ul>');
                                   for (var i=0; i<vehicles.length; i++){
                                   $ul.append('<li><div data-role="collapsible" data-collapsed="true" data-theme="b"></h3>' + vehicles[i] + '</div></li>');
                                   }
                                   }
                                   }
                                   });
                            });

尝试加载内容的HTML：

<div data-role="page" id="testcatalog">
            <div data-role="content" id="test-content">
                <!--CONTENT SHOULD LOAD HERE-->  
            </div>

Answer 1

出温，

我会使用“关联数组”，它使用“类别”作为键，并为每个类别添加“名称”。填充了一个assosiative数组，然后您可以遍历键（类别）并提取名称。 e.g。

$.ajax({
    type: "GET",
      url: "vehicles.xml",
    dataType: "xml",
    success: function(xml) {
        var $body = $('body');
        var $ul; 
        var categories = new Object();
        var category;
            $(xml).find('test').each(function(){
            category = $('category', this).text();
            if (categories[category] == undefined){
                categories[category] = $('name', this).text();
            } else {
                categories[category] += ',' + $('name', this).text();
            }
        });
        for (category in categories) {
            $body.append('<h1>' + category + '</h1>');
            var vehicles = categories[category].split(',');
            $ul = $body.append('<ul></ul>');
            for (var i=0; i<vehicles.length; i++){
                $ul.append('<li>' + vehicles[i] + '</li>');
            }
        }
    }
});

我希望这能回答你的问题。

此致尼尔

使用jquery / jquery mobile将xml字段用作列表分隔符

1 个答案: