有人可以检查一下并告诉我出了什么问题......我只是看不到它:
function getStates(){
var stateData;
$.getJSON("getStateData.php", function(data) {
stateData = data;
var theLastGroup = "";
$("#groupList").empty();
$("#stateList").empty();
$.each(stateData, function(i,jsonData) {
if( theLastGroup != jsonData.groupName )
{
$("#listModel").clone(true).removeAttr("id").attr("id", "Group_" + i).removeClass("hidden").appendTo($("#groupList"))
.find(".url").attr("href", "#"+jsonData.groupName).end()
.find(".groupName").html(jsonData.groupID);
$("#groupModel").clone(true).removeAttr("id").removeClass("hidden").attr("id", jsonData.groupName).appendTo($("#stateList"));
}
$("#stateModel").clone(true).removeAttr("id").attr("id", jsonData.stateName).removeClass("hidden").appendTo($("#"+jsonData.groupName))
.attr("sname", jsonData.stateName).attr("lat", jsonData.centerLat).attr("lon", jsonData.centerLon)
.attr("zom", jsonData.zoom).html(jsonData.stateName);
if( theLastGroup != jsonData.groupName )
{
theLastGroup = jsonData.groupName;
}
});
$("#tabs").tabs();
});
}
...以及最终调用上面的getStates()的HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>My Page</title>
<link href="js_src/css/cupertino/jquery-ui-1.8.11.custom.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?libraries=geometry&sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.js"></script>
<script type="text/javascript" language="javascript" src="js_src/geoxml3.js"></script>
<script type="text/javascript" language="javascript" src="js_src/CTR.js"></script>
<script type="text/javascript" language="javascript" src="js_src/common.js"></script>
<script type="text/javascript" language="javascript" src="js_src/mapNull.js"></script>
<script type="text/javascript" language="javascript" src="js_src/functions.js"></script>
<style type="text/css">
div.hidden {display:none;}
li.hidden {display:none;}
span.hidden {display:none;}
</style>
</head>
<ul>
<li id="listModel" class="hidden"><a class="url"><span class="groupName"></span></a></li>
<div id="groupModel" class="hidden"></div>
<span id="stateModel" class="hidden" sname="name" lat="0.0" lon="0.0" zom="7"></span>
</ul>
<body>
<h4>MyPage</h4>
<div id="tabs" style="height:100px" class="hidden">
<h5>select a state...</h5>
<ul id="groupList"></ul>
<div id="stateList"></div>
</div>
<div id="map" style="float:left;"></div>
</body>
</html>
当页面加载时,从mapNull.js脚本调用getStates()函数...
有什么想法吗?
答案 0 :(得分:0)
您的代码的这一部分介于</head>
和<body>
之间....也就是说,在<body>
标记之外:
<ul>
<li id="listModel" class="hidden"><a class="url"><span class="groupName"></span></a></li>
<div id="groupModel" class="hidden"></div>
<span id="stateModel" class="hidden" sname="name" lat="0.0" lon="0.0" zom="7"></span>
</ul>
将其置于<body>
内将是迈向这项工作的良好开端:)