我正在创建一个仅包含一个信息容器的页面。当用户单击左侧的特定按钮时，容器的内容将切换。但是，此时此站点将加载每个内容部分。其中一个包含我的投资组合，这将是一个大图像集合，这将阻止网站快速加载。
因此，在单击显示该div内容的按钮之前，我不想制作特定负载的内容。
有关我要实现的目标的快速示例：请
访问http://iscs.nl/testpage_changecontent.html
不应在开始时加载的div的内容是#page_portfolio，这将通过单击按钮#pagebutton_portfolio来显示。注意：以上链接的测试页上未使用这些ID。
谢谢大家，期待代码。
假设投资组合内容在portfolio.html：
$('#tabcontent2').click(function(e){
$('#content_1').hide();
$("#content_2").show()
// grab portoflio.html and place its contents within #content_2
.load('portfolio.html');
e.preventDefault();
});
您甚至可能想要使用data-*属性，以免重新加载页面（一次获取）：
$('#tabcontent1').click(function(e){
$('#content_2').hide();
$('#content_1').show();
e.preventDefault();
});
$('#tabcontent2').click(function(e){
$('#content_1').hide();
var $content2 = $("#content_2").show();
// check if it's been loaded before
if (!($('#content_2').data('loaded') || false)){
// grab portoflio.html and place its contents within #content_2
$content2.load('portfolio.html', function(){
// set the flag to say we've already loaded this content
$content2.data('loaded',true);
});
}
e.preventDefault();
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句