从JSON获取数据时,使用其他数据获取“未定义”

时间:2013-03-06 04:49:59

标签: jquery json jquery-mobile

我使用此代码使用jQuery从JSON获取值:

$(document).ready(function() {
            $.ajax({
                type : 'GET',
                url : 'outfitters.json',
                dataType : 'json',
                success : processTeam,
                error : function() {
                    alert('error');
                }
            });
        });

        function processTeam(data) {
            var company = data.company;
            $("h1").html(company);

            var locations;
            for ( i = 0; i < data.locations.length; i++) {

                locations += data.locations[i].name + "<br/>";

            }
            $("li").html(locations);

        }

实际上,我得到了预期的输出,但在输出的开头有一个额外的“未定义”,如下所示:

undefinedKincardine
Killarney
Bon Echo

此外,我正在使用jQuery移动列表框,但它只在一个列表框中填充值,尽管它应该在三个单独的列表框中显示它。

<ul data-role="listview">
            <li>

            </li>

        </ul>

我在代码中遇到的任何错误?

4 个答案:

答案 0 :(得分:1)

初始化变量var locations = '';

答案 1 :(得分:1)

您需要先初始化变量。

var locations='';

因为当您尝试追加未启动的数据时。所以首先它将是undefined + youvalue。所以你得到undefinedKincardine第一个结果

答案 2 :(得分:1)

如果没有初始化位置,则使用它,以便通过未定义的错误消息。

var locations = '';

答案 3 :(得分:0)

我认为你的HTML看起来如下

<div data-role="page">
    <div data-role="header">
        <h1>header</h1>
    </div>
    <div data-role="content">
        <h2 id="companyName">my list</h2>
        <div id="locationList"></div>
    </div>
</div>

然后您的processTeam应该如下

var company = JSON.parse(data);

//setting company name
$('#companyName').text(company.company);

//setting the list view
//running a loop first
var locationsStr = "<ul data-role='listview'>";
$.each(company.locations, function(){
   locationsStr = locationsStr + "<li><a href='#'>"+this.name+"</a></li>";
});
locationsStr = locationsStr+ "</ul>";
$('#locationList').html(locationsStr);
$('#locationList ul').listview();

你可以在http://jsfiddle.net/eTpSQ/1/

查看一个工作小提琴