javascript - XML 解析意外行为 LiScroll

标签 javascript jquery html css xml

我从一些 jquery xml 解析中得到了意外的行为。

我使用以下代码从服务器获取文件

$.ajax({
    type: "GET",
    url: "//path/test.xml",
    dataType: "xml",
    success: function(xml) { //do stuff }

它没有按预期执行,如果我直接从文件中获取数据并将其硬编码到我的 JS 中,它会按预期工作。文件中的数据格式为

<?xml version="1.0" encoding="utf-8"?><ProductRates xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" Total="64" Region="UK"><ProductRate><Description>UAE - Dirham</Description><ProductType>CUR</ProductType><CurrencyCode>AED</CurrencyCode><Rate>5.4427</Rate></ProductRate><ProductRate><Description>Australia - Australia Dollar</Description><ProductType>CUR</ProductType><CurrencyCode>AUD</CurrencyCode><Rate>1.6726</Rate></ProductRate></ProductRates>

所以一旦我得到 xml,它就会像这样处理

var $xml = $(xml);
var $list = $('#ticker'); 
$prodtype = $xml.find("ProductType");
$prodtype.each(function() {
var self = $(this);
if( self.text() == "CUR") { 
    var 
        $CurrencyCode = self.next('CurrencyCode')
        $Rate         = $CurrencyCode.next('Rate')          
    ; 
    $( "#ticker" ).append("<li><a>" +$CurrencyCode.text()+" = "+ $Rate.text()+ " </a></li>");

}

});

我正在使用 http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html 中的 liScroll js/css|它确实有效,但列表项是垂直堆叠的,而不是水平堆叠在代码容器中的。可能是 xml 文件的解析方式?

页面运行时关联的css,希望对你有帮助...

element.style {
background-image: url(test.img);
}
Matched CSS Rules
currency_ticker_test.shtmlmedia="all"
#content-header {
background-repeat: no-repeat;
background-position: center top;
}
currency_ticker_test.shtmlmedia="all"
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
user agent stylesheetdiv {
display: block;
}
Inherited from div#shell
currency_ticker_test.shtmlmedia="all"
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
font-size: 100%;
}
Inherited from body
currency_ticker_test.shtmlmedia="all"
body {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
color: #2f2f2f;
}
currency_ticker_test.shtmlmedia="all"
body {
line-height: 1;
}
currency_ticker_test.shtmlmedia="all"
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
font-size: 100%;
}
Inherited from html
currency_ticker_test.shtml media="all"
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
font-size: 100%;
}

最佳答案

您的 xml 结构无效。您有两个打开的 ProductRates 元素。

<ProductRates xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" Total="64" Region="UK">
<ProductRates>

检查有效 xml 的最佳方法是将输出保存到 xml 文件并在浏览器中打开。

关于javascript - XML 解析意外行为 LiScroll,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18573512/

相关文章:

javascript - 如何在主 "div"内的随机 "div"创建点击事件?

javascript - 无法使用 document.cookie(本地 HTML 文件)从以前的 session 中检索 cookie

javascript - 谷歌地图 - jquery切换滑动

javascript - Mobile Safari - 滚动到元素

javascript - jQuery 对话框 - 一个独特的对话框在 ajax 站点上被复制

javascript - 为什么这段代码不能专注于所需的 div?

javascript - 单击菜单更改文本

javascript - 通过href获取<a></a>标签之间的值

javascript - 将数组中的变量替换为循环中的数据

javascript - 使用 ajax 从数据库 EntityFramework 中删除记录