【问题标题】:Parse XML via jquery on listview jquerymobile在listview jquerymobile上通过jquery解析XML
【发布时间】:2014-07-19 22:06:17
【问题描述】:

我想用 jquery 和 jquerymobile 在列表中显示来自 XMl 的数据。我在这里看到了很多 samy topcis,但这对我没有帮助。因此,我将向您展示我所做的代码,并请一些人告诉我我做错了什么。

这是我的 Xml(称为 emertimi.xml,它位于根目录):

 <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<Root xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
    <Row>
        <Emri>Abide</Emri>
        <Kuptimi>Adhuruese</Kuptimi>
        <Gjinia>Femer</Gjinia>
    </Row>
    <Row>
        <Emri>Abire</Emri>
        <Kuptimi>Aromë e mirë lulesh.</Kuptimi>
        <Gjinia>Femer</Gjinia>
    </Row>
    <Row>
        <Emri>Adhra</Emri>
        <Kuptimi>Margaritarë i pashpuar</Kuptimi>
        <Gjinia>Femer</Gjinia>
    </Row>
    <Row>
        <Emri>Adile</Emri>
        <Kuptimi>E drejtë</Kuptimi>
        <Gjinia>Femer</Gjinia>
    </Row>
    <Row>
        <Emri>Afife</Emri>
        <Kuptimi>E pastër; E thjeshtë; E lehtë</Kuptimi>
        <Gjinia>Femer</Gjinia>
    </Row>
</Root>

这是我的 html 和 jquery

<html>
<!DOCTYPE html>
<head>
    <title>..:Emra per femije:..</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css"  href="site.css">
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,100italic,300italic,500,400italic,500italic,700italic,700,900,900italic' rel='stylesheet' type='text/css'>
    <meta name="viewport" content="widdiv=device-widdiv, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
    <script type="text/javascript" src="main.js"></script>  
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function()
        {
          $.ajax({
            type: "GET",
            url: "emertimi.xml",
            dataType: "xml",
            success: parseXml
          });
        });

        function parseXml(xml)
        {
          $("#menu_meshkujt").html("<ul id='content' data-role='listview' data-inset='true'></ul>");
          $(xml).find("Row").each(function()
          {
            $("#content").append("<li><a href='"+$(this).find("Emri").text()+"'><h2>"+$(this).find("Kuptimi").text()+"</h2><p>"+$(this).find("Gjinia").text()+"</p></a></li>");
          });  
        }
</script>
 </head>
<body>
<div id="meshkujt_wrapper" data-role="page">
<div id="menu_meshkujt" >


        </div>
</div>
</body>
</html>

【问题讨论】:

  • 有人可以帮我吗

标签: jquery xml html xml-parsing jquery-mobile-listview


【解决方案1】:

我使用您的代码更改 url 从我的本地 apache 下载 xml 并在 chrome 上正常工作:

也许你的问题是服务器调用没有像你期望的那样返回你的 XML。在您的 ajax 调用中添加错误函数定义以检查是否发生错误:

$(document).ready(function()
    {
      $.ajax({
        type: "GET",
        url: "emertimi.xml",
        dataType: "xml",
        success: parseXml,
        error : function(jqXHR, textStatus, errorThrown){
            alert(textStatus);
            alert(errorThrown);
        }
      });
    });

编辑:

我刚刚意识到您正在尝试从本地文件加载 XML,由于安全要求,这在某些浏览器中是不允许的。如果您想尝试使用 chrome,您可以禁用 chrome websecurity。为此,请尝试从命令行使用 --disable-web-security 属性启动 chrome(在开始之前确保没有运行任何 chrome 实例,如果不是 disable-web-security 不起作用):

"C:\...\Google\Chrome\Application\chrome.exe" --disable-web-security

我检查了你的代码并禁用了它在本地文件中运行的 chrome 网络安全,还记得在你的 ajax 调用中指定 url:"file:///your_path"

当您使用 --disable-web-security 属性正确启动 chrome 时,您必须看到黄色警告:

希望这会有所帮助,

【讨论】:

  • 感谢您的回复,现在我尝试使用 mozilla 中的旧代码并且它可以工作,但在 chrome 中还没有。它说 erorr:: 就是这样
  • 我更新了我的答案,我没有意识到您在 ajax 调用中直接使用本地文件。我希望这次答案是正确的:)。
  • 如何禁用安全性我不知道,我正在尝试不同的方式,但它不起作用:(还有如何指定 url 文件///emertimi.xml?ps 抱歉我的问题,但我真的不知道怎么弄。
  • 我在网上试过,效果很好。我会为 android 做这个(hopw 我可以做到),所以当我启动它时,你知道它是否可以作为一个 android 应用程序工作,因为我不在线使用该文件。?
  • 你想用即 webview 生成一个 android 应用程序并从 html 加载本地 xml 吗?你看到这个stackoverflow.com/questions/20425481/…了吗?
猜你喜欢
  • 1970-01-01
  • 2012-03-23
  • 1970-01-01
  • 2023-03-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多