目前,我让页面加载了以下内容:
<div class="accordion">
<h2><a href="#">Pending Flyers</a></h2>
<div id="flyers-0" class="accordion-item"><% Html.RenderPartial("ManageFlyers", new { flyers = pendingFlyersWithCategory }); %></div>
<h2><a href="#">Approved Flyers</a></h2>
<div id="flyers-1" class="accordion-item"><% Html.RenderPartial("ManageFlyers", new { flyers = approvedFlyersWithCategory }); %></div>
<h2><a href="#">Denied Flyers</a></h2>
<div id="flyers-2" class="accordion-item"><% Html.RenderPartial("ManageFlyers", new { flyers = deniedFlyersWithCategory }); %></div>
<h2><a href="#">Published Flyers</a></h2>
<div id="flyers-3" class="accordion-item"><% Html.RenderPartial("ManageFlyers", new { flyers = publishedFlyersWithCategory }); %></div>
<h2><a href="#">Expired Flyers</a></h2>
<div id="flyers-4" class="accordion-item"><% Html.RenderPartial("ManageFlyers", new { flyers = expiredFlyersWithCategory }); %></div>
</div>
使用此JavaScript来实现手风琴效果:
<script language="javascript" type="text/javascript">
if ($('.accordion').length > 0) {
$('.accordion-item').hide();
$('.accordion-selected').show();
$('.accordion h2').click(function () {
$(this).next('.accordion-item').slideToggle('slow');
});
$('.accordion h2 a').click(function () {
var element = $(this).parent().next('.accordion-item');
element.slideToggle('slow');
return false;
});
}
</script>
<script type="text/javascript">
$(document).ready(function () {
// Accordian state restore
var accord = '<%= Session["accordianIndex"] %>';
var currentindex = 0;
if (accord != "") {
currentindex = accord;
}
$("#flyers-" + currentindex).slideToggle("slow");
// end Accordian state restore
});
$("div.description").expander({
slicePoint: 200
});
</script>
我希望使用AJAX加载部分视图,并在手风琴展开时插入它们,以加快页面的初始加载速度。
我尝试过使用<%= Ajax.ActionLink ... %>
和javascript来加载它,但无法使其正常工作。如有建议,敬请提出。
ASP.NET MVC
。 - James Johnson