我有两页。为了便于说明，我将其称为页面A和页面B.当我在浏览器中打开页面B时，所有样式和jquery ui代码都正常工作，但是当我在页面A中的div中打开页面B时load（）方法，唯一呈现的是原始html，没有样式，没有接口。问题是什么？下面是B页的代码，底部的代码是A页的代码：
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script> //jquery ui
<link rel="stylesheet" href="http://spilot.koding.com/lbStyle.css"/> //stylesheet
<script src="http://www.parsecdn.com/js/parse-1.2.2.min.js"></script> //parse database
<script>
$(function(){
var crowd = ' ';
var ageGroup = ' ';
var activity = [];
var scene = [];
var neighborhood = [];
var date = [];
var details = [];
var time = [];
Parse.initialize("ivHLAO7z9ml1bBglUNuPSgcWabXe3UeE2yCgKM2x","gNeGt04lU7xcew893EvbEJ05qqc4POVhBsIBSCVj");
$(".menu").menu({
select: function (event, ui) {
$('.selected', this).removeClass('selected');
var selection = ui.item.addClass('selected').children('a').attr('name'); //add background color to selected menu item and get its attribute name
var choice = ui.item.text(); //get text of menu selection
if(selection == "ageGroup"){
$("#ageGroup").text(choice); //change the text in the first <a> of ageGroup menu to ageGroup selection.
ageGroup = $("#ageGroup").text();
}else{
crowd = selection;
};
} // closes select function
}); // closes menu
$("button").click(function(){
var city = JSON.parse( localStorage.getItem('city') );
var niche = Parse.Object.extend(crowd);
var query = new Parse.Query(niche);
query.equalTo("ageGroup", ageGroup);
query.equalTo("city", city);
//query.include([activity.date.details.location.neighborhood.time])
query.find({
success: function(results) {
for (i = 0; i < results.length; i++){
activity = results[i].get("activity");
scene = results[i].get("location");
neighborhood = results[i].get("neighborhood");
date = results[i].get("date");
details = results[i].get("details");
time = results[i].get("time");
};
},
error: function(error) {
alert("Error: " + error.code + " " + error.message);
}
});
//alert("working");
}); //closes click()
}); // close function()
</script>
<script>
$(function(){
$( "button" ).button();
});
</script>
</head>
<body>
<div id="div1">
<button>Button label</button>
<div id="div2">
<ul class="menu">
<li>
<a href="#" id="ageGroup">Age Group</a>
<ul>
<li><a href="#" name="ageGroup">18-21</a></li>
<li><a href="#" name="ageGroup">21-30</a></li>
<li><a href="#" name="ageGroup">30-40</a></li>
<li><a href="#" name="ageGroup">40-50</a></li>
<li><a href="#" name="ageGroup">50-60</a></li>
<li><a href="#" name="ageGroup">60-70</a></li>
<li><a href="#" name="ageGroup">70-80</a></li>
<li><a href="#" name="ageGroup">80-90</a></li>
<li><a href="#" name="ageGroup">90-100</a></li>
</ul>
</li>
</ul>
</div>
<div id="div3">
<ul class="menu" id="menu">
<li><a href="#" name="academic_artStudies" id="academic_artStudies"><img src="" alt="" /><h2>Academic: Art Studies</h2></a></li>
<li><a href="#" name="academic_Literature"><img src="" alt="" /><h2>Academic: Literature</h2></a></li>
<li><a href="#" name="academic_socialSciences"><img src="" alt="" /><h2>Academic: Social Sciences</h2></a></li>
<li><a href="#" name="academic_physicalNaturalSci"><img src="" alt="" /><h2>Academic: Physical/Natural Sciences</h2></a></li>
</ul>
</div>
</div>
</body>
</html>
--------------//PAGE A//--------------
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(function(){
$("#mainDiv").load("http://myURl.com/find2.html"); //this is where I call load()
});
</script>
</head>
<body>
//this is the div where I want the other page to load
<div id="mainDiv">
</div>
</body>
</html>
答案 0 :(得分：1)
由于您正在将页面“b”加载到页面“a”中，因此您需要在页面“a”标题中包含所有页面“b”样式表/ js。
请注意，您正在将一个完整的html页面加载到页面“a”，其中包括html，header，body，这是不可取的，您应该将页面“b”设置为仅包含所需标记的模板。 / p>
<强>更新