1

我的 jquery 代码来获取名称、代码和类别：

     $(req.responseText).find("Table").each(function(i) {
              var item = $(this),
              name = item.find('Name').text(),
              code = item.find('Code').text(),
              catg = item.find('Category').text();                    

                 var $content = $('<li><a href="#"><img src="../../img/album-bb.jpg"><h3>Name: '+ name + '</h3><p>Code: '+ code + '</p><p>Category: '+ catg + '</p></a><a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Add to favorites</a></li>');                              
                 $('#RecipeList').append($content).listview('refresh');



      });

这是我的 XML 的示例响应：

<Table diffgr:id="Table1" msdata:rowOrder="0">
    <Code>106377</Code>
    <Name>Blackened red snapper</Name>
    <Category>123</Category>
    <Yield>4</Yield>
    <YieldUnit/>
</Table>
<Table diffgr:id="Table2" msdata:rowOrder="1">
    <Code>303570</Code>
    <Name>Celery soup</Name>
    <Category>123</Category>
    <Yield>1</Yield>
    <YieldUnit/>
</Table>
<Table diffgr:id="Table3" msdata:rowOrder="2">
    <Code>303675</Code>
    <Name>Challah French Toast</Name>
    <Category>123</Category>
    <Yield>6</Yield>
    <YieldUnit/>
   </Table>

listview 输出是这样的：

Name: Blackened red snapperCelerySoupChallah French toast
Code: 106377303570303675
Category: 123123123

如何放入不同的列表视图？..当它追加时。谢谢

4

2 回答 2

1

试试这个：

var ni = 0;
var ci = 0;
var cati = 0;
var NameArr = new Array();
var CodeArr = new Array();
var CatArr  = new Array();

$(req.responseText).find('Name').each(function () {
  NameArr[ni] = $(this).text();
  ni++;
}

$(req.responseText).find('Code').each(function () {
  CodeArr[ci] = $(this).text();
  ci++;
}

$(req.responseText).find('Category').each(function () {
  CatArr[cati] = $(this).text();
  cati++;
}

for(var i=0; i<NameArr.length; i++){
    var $content = $('<li><a href="#"><img src="../../img/album-bb.jpg"><h3>Name: '+ NameArr[i] + '</h3><p>Code: '+ CodeArr[i]+ '</p><p>Category: '+ CatArr[i]+ '</p></a><a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Add to favorites</a></li>');                              
    $('#RecipeList').append($content).listview('refresh');
}
于 2013-04-25T08:09:03.323 回答
1

工作示例：http: //jsfiddle.net/Gajotres/uzphF/

$('#index').live('pagebeforeshow',function(e,data){    
    $('#table-data').empty();
    $.ajax({
        type: "POST",
        url: "/echo/xml/",
        dataType: "xml",
        data: {
            xml: '<Tables><Table><Code>106377</Code><Name>Blackened red snapper</Name><Category>123</Category><Yield>4</Yield><YieldUnit/></Table><Table><Code>303570</Code><Name>Celery soup</Name><Category>123</Category><Yield>1</Yield><YieldUnit/></Table><Table><Code>303675</Code><Name>Challah French Toast</Name><Category>123</Category><Yield>6</Yield><YieldUnit/></Table></Tables>'
        },
        success: function(xml) {
            ajax.parseXML(xml);
        },
        error: function (request,error) {
            alert('Network error has occurred!');
        }
    });
});

var ajax = {  
    parseXML:function(result){
        $(result).find("Table").each(function(){
            var code  = $(this).find('Code').text();
            var name  = $(this).find('Name').text();
            var cat  = $(this).find('Category').text();
            var yield  = $(this).find('Yield').text();

            $('#table-data').append('<li><a href="#cars"><h3>Table code:<span> '+code+'</span></h3><p>Table name: ' + name + '</p></a></li>');
        });    
        $('#table-data').listview('refresh');
    }
}

本例使用 mockup jsFiddle 函数来测试 XML ajax 调用，但这部分不是必须的。您只需要知道如何循环通过 XML。还有一件事，您的 XML 示例必须包含在父标记中，我将其命名为tables。

于 2013-04-25T08:15:24.783 回答