javascript - Jquery 似乎无法读取 JSON 文件

Question

我有一个包含数据的 JSON 文件和一个 jquery 脚本，该脚本应该将该数据放入列表中，但由于某种原因根本无法读取任何内容。

这是代码

<div data-role="mainPage" data-theme="a">

<div data-role="header">
    <h1>My Title</h1>
</div>

<div data-role="content">
 <ul data-role="listview" id="fixturesList">

    </ul>
 </div>
</div>  

<script type="text/javascript">



$.getJSON("http://localhost/tutorials/results.json", function(matchTable){
//Start off with an empty list every time to get the latest from server
 $('#fixturesList').empty();

 //add the games to be played as a list
 $.each(matchTable, function(i, match){
  ('#fixturesList').append(generateMatchLink(match));
 });

 $('#fixturesList').listview('refresh');

});


function generateMatchLink(match){

    //debugger
    return '<li><a href="javascript:void(0)'
    + '" onclick="goToMovieDetailPage(\''
    + match.Home +'\')">' 
    + match.Home 
    + '</a></li>';
}

function goToMatchDetailPage(matchHome){

    //create the html template
    var matchPage = $("<div data-role='page' data-url=dummyUrl><div data-role='header'><h1>"
              + matchHome + "</h1></div><div data-role='content'><img border='0' src='
              http://www.songho.ca/opengl/files/gl_mvc01.png' width=204 height=288></img>    </div><div data-role='footer'><h4>" 
              + matchHome + "</h4></div></div>");

    //append the new page to the page contanier
    matchPage.appendTo( $.mobile.pageContainer);

    //go to the newly created page
    $.mobile.changePage(matchPage);
}

</script>

这是 JSON 文件

[{"Fix":"1","Home":"Manchester United","Away":"Aston Villa","Stadium":"Old Trafford"},{"Fix":"2","Home":"Crystal Palace","Away":"Chelsea","Stadium":"Selhurst Park "},{"Fix":"3","Home":"Southampton","Away":"Newcastle United","Stadium":"The Friends Provident St Marys Stadium"},{"Fix":"4","Home":"Stoke City","Away":"Hull City","Stadium":"Britannia Stadium"},{"Fix":"5","Home":"Swansea City","Away":"Norwich City","Stadium":"Liberty Stadium"},{"Fix":"6","Home":"West Bromwich Albion","Away":"Cardiff City","Stadium":"The Hawthorns"},{"Fix":"7","Home":"Arsenal","Away":"Manchester City","Stadium":"Emirates Stadium"},{"Fix":"8","Home":"Fulham","Away":"Everton","Stadium":"Craven Cottage"},{"Fix":"9","Home":"Liverpool","Away":"Tottenham Hotspur","Stadium":"Anfield"}]

是否有什么东西被我忽略了？

Answer 1

('#fixturesList').append(generateMatchLink(match));

应该是

$('#fixturesList').append(generateMatchLink(match));

还有第二个问题，可能是由于复制/粘贴造成的:

var matchPage = $("<div data-role='page' data-url=dummyUrl><div data-role='header'><h1>"
          + matchHome + "</h1></div><div data-role='content'><img border='0' src='
          http://www.songho.ca/opengl/files/gl_mvc01.png' width=204 height=288></img>    </div><div data-role='footer'><h4>" 
          + matchHome + "</h4></div></div>");

Javascript 字符串不能包含换行符。修复如下:

var matchPage = $("<div data-role='page' data-url=dummyUrl><div data-role='header'><h1>"
          + matchHome + "</h1></div><div data-role='content'><img border='0' src='http://www.songho.ca/opengl/files/gl_mvc01.png' width=204 height=288></img>    </div><div data-role='footer'><h4>" 
          + matchHome + "</h4></div></div>");