使用Jquery获取XML并放入html表 [英] using Jquery to get XML and put into html table

查看:65
本文介绍了使用Jquery获取XML并放入html表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道以前已经有人问过这个问题,但是我不知道出什么问题了,我正在尝试使用jQuery使用显示列表来加载XML文件,以便可以在一个文件中更新显示,并且上载到多个页面.对我来说,似乎一切都做对了,但是我的知识型jQuery充其量是脆弱的.大部分只是从其他问题的答案中拼凑而成.

I know this has been asked before, but I can't figure out what's wrong, I'm trying to load in a XML file with a list of shows using jQuery so that the shows can be updated in one file, and upload onto multiple pages. To me it seems like I'm doing everything right, but my knowledge jquery is fragile at best. Most of it is just pieced together from answers to others questions.

我的HTML

<aside id="shows"class="aside shadow">
<div class="text" id="table">
<div class="more low"> MORE SHOWS </div>
<div class="less"> LESS SHOWS </div>
</div>
</aside>

我的Jquery

function showData() {
$.ajax({
   type: "GET",
   url: "shows.xml",
   dataType: "xml",
   success: function getShows(a) {
    $('#table').append('<h2>SHOWS</h2>'); 
    $('#table').append('<table>'); 

    $(a).find('show').each(function(){
        var $show = $(this);
        var date = $show.find('date').text();
        var place = $show.find('place').text();
        var location = $show.find('location').text();
        var time = $show.find('time').text();

        var html = '<tr><td class="bold">' + date + '</td><td class="hide">' + place + '</td><td>' + location + '</td><td class="bold">' + time + '</td></tr></table>';

        $('<table>').append(html);

    });
    }
 });
}

和XML

<shows>
<show>
    <date>9/8</date>
    <place>Toads Place</place>
    <location>New Haven, CT</location>
    <time>9PM</time>
</show>

</shows>

这没什么, 这对我来说似乎完全正确,所以我非常困惑.认识我,我想念一个半冒号. ><

This does NOTHING and This looks totally right to me, so I'm super confused. Knowing me, I'm missing a semi colon. ><

谢谢!

推荐答案

可以确认ajax调用工作正常并且调用成功方法.
您可以检查ajax调用和firebug的响应.
如果xml正常返回,您可以尝试以下方法,对成功方法进行一些修改,例如 http://jsfiddle.net/Jayendra/2PFxr/

Can you confirm the ajax call works fine and the success method is called.
You can check the ajax call and the response on firebug.
If the xml is returned fine, you may want to try below, modified the success method a little e.g. http://jsfiddle.net/Jayendra/2PFxr/

尝试-

$.ajax({
    type: "GET",
    url: "shows.xml",
    dataType: "xml",
    success: function(xml){
        $('#table').append('<h2>SHOWS</h2>'); 
        $('#table').append('<table id="show_table">'); 
        $(xml).find('show').each(function(){
            var $show = $(this);
            var date = $show.find('date').text();
            var place = $show.find('place').text();
            var location = $show.find('location').text();
            var time = $show.find('time').text();
            var html = '<tr><td class="bold">' + date + '</td><td class="hide">' + place + '</td><td>' + location + '</td><td class="bold">' + time + '</td></tr>';
            $('#show_table').append(html);
        });
    }
});

这篇关于使用Jquery获取XML并放入html表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆