我在我的一个html页面中使用tab并通过在同一页面上使用ajax加载一些其他页面,但问题是html页面没有反映它与以前保持相同的更改,是否有任何类型的缓存问题或其他我将localhost用于同一个xampp服务器。 js代码是
var containerId = '#tabs-container';
var tabsId = '#tabs';
$(document).ready(function(){
if($(tabsId + ' LI.current A').length > 0){
loadTab($(tabsId + ' LI.current A'));
}
$(tabsId + ' A').click(function(){
if($(this).parent().hasClass('current')){ return false; }
$(tabsId + ' LI.current').removeClass('current');
$(this).parent().addClass('current');
loadTab($(this));
return false;
});
});
function loadTab(tabObj){
if(!tabObj || !tabObj.length){ return; }
$(containerId).addClass('loading');
$(containerId).fadeOut('fast');
$(containerId).load(tabObj.attr('href'), function(){
$(containerId).removeClass('loading');
$(containerId).fadeIn('fast');
});
}
html代码是:
<ul class="mytabs" id="tabs">
<li class="current">
<a href="tabs/room.html">
Rooms and Suits
</a>
</li>
<li>
<a href="tabs/dining.html">
Dining
</a>
</li>
<li>
<a href="tabs/spa.html">
Spa & Wellness
</a>
</li>
<li>
<a href="tabs/wedding.html">
Wedding
</a>
</li>
<li>
<a href="tabs/event.html">
Meetings & Events
</a>
</li>
<!--
example how to integrate in php
<li>
<a href="wp-content/themes/himachaldastak/sport.php">
Meetings & Events
</a>
</li> -->
</ul>
<div class="mytabs-container" id="tabs-container">
<img src="img/ajax-loader.gif" alt="loading.." id="photo_load">
</div>