jQuery Mobile XML解析到表中

问题描述：

我刚开始使用jQuery Mobile框架，并想修改我最初设置为网格的表格。我面临的问题是，我只是从我的XML解析中获取第一行数据，尽管有8个数据量来。jQuery Mobile XML解析到表中

我猜测网格会自动为每个新设置添加一行发现Tabe布局不在哪里，并且可能需要某种“每个”来发现它的每一个数据 - 我不知道如何做到这一点，如果是这样的话，但如果任何人可以帮助，我会非常感激 - 谢谢。

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
    <title>Table</title> 

    <!--Standard Jquery Stuff here--> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script> 

    <meta name="apple-mobile-web-app-capable" content="yes" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0" /> 

    <!--Set the Icons to be used if saved to an apple home screen--> 
    <link rel="apple-touch-icon" href="_/images/iOS_Icons/iPhoneIcon.png" /> 
    <link rel="apple-touch-icon" sizes="72x72" href="_/images/iOS_Icons/iPadIcon.png" /> 
    <link rel="apple-touch-icon" sizes="114x114" href="_/images/iOS_Icons/[email protected]" /> 
    <link rel="apple-touch-icon" sizes="144x144" href="_/images/iOS_Icons/[email protected]" /> 

    <!-- Custom css --> 
    <link rel="stylesheet" href="../_/css/Michaels.css" /> 

    <!-- dpv feed--> 
      <script type="text/javascript"> 
       var xml; 
       $(document).ready(function(){ 
        $.ajax({ 
         type: "GET", 
         url: "../_/xml/dpv.xml", 
         dataType: "xml", 
         success: xmlParser 
        }); 
       }); 

        //loading XML file and parsing to .main div. 
        function xmlParser(data) { 
         xml = data; 

         $('#load').fadeOut(); 

         $(xml).find("location").each(function() { 
          var name = $(this).find("name").text(); 
          var target = $(this).find("target").text(); 
          var actual = $(this).find("actual").text(); 
          var thru = $(this).find("thru").text(); 
          var lastmod = $(this).find("lastmodified").text(); 

          $("#dpvtable").append('<tr><th><a href="dpv_graphs/dpv-' + name + '.html" rel="external">'+name+'</a></th><td>' + actual + '</td><td>' + target + '</td><td>' + thru + '</td></tr>'); 

          $('#dpvtable').tableview('refresh'); 

         }); 
        }   
      </script> 
    </head> 
<body> 
<!-- DPV --> 
<div data-role="page" id="dpv"> 
    <div data-role="header" data-position="fixed"> 
     <h1>DPV</h1> 
    </div> 
    <div data-role="content" data-theme="a" > 
     <ul id="table" data-role="tableview"> 
      <li id="load">Loading Data...</li> 
     </ul> 
     <table data-role="table" id="dpvtable" data-mode="columntoggle" class="ui-responsive table-stroke"> 
      <thead> 
       <tr> 
        <th>Location</th> 
        <th data-priority="1">DPV</th> 
        <th data-priority="1">Target</th> 
        <th data-priority="2">Thru</th> 
       </tr> 
      </thead> 
     <tbody> 

      </tbody> 
     </table> 
    </div> 
</div> 
<!--Footer--> 
<div data-role="footer" style="text-align:center" data-position="fixed"> 
    <a class="ui-btn-left" data-icon="home" style="margin: float" href="../index.html" data-transition="flip">Home</a> 
</div> 
</body>

答

我已经想通了编码或删除：

$('#dpvtable').tableview('refresh');

已经把整个表的地方！现在我只需要弄清楚如何配置它以使用新的列隐藏功能...

jQuery Mobile XML解析到表中

相关推荐