Javascript 使用JQuery ajax选项卡以不同方式显示选定的选项卡
我有预装内容的选项卡,如下所示:Javascript 使用JQuery ajax选项卡以不同方式显示选定的选项卡,javascript,ajax,jquery-tabs,Javascript,Ajax,Jquery Tabs,我有预装内容的选项卡,如下所示: $(function () { $('div.tabs ul.tabNavigation a').click(function () { $('div.tabs ul.tabNavigation a').removeClass('selected'); $(this).addClass('selected'); return false; }).filter(':first').click();
$(function () {
$('div.tabs ul.tabNavigation a').click(function () {
$('div.tabs ul.tabNavigation a').removeClass('selected');
$(this).addClass('selected');
return false;
}).filter(':first').click();
});
$(function() {
$("#tabs").tabs({
ajaxOptions: {
error: function(xhr, status, index, anchor) {
$(anchor.hash).html("there was a problem");
}
}
});
});
这将class=“selected”添加到链接和css中,使所选选项卡看起来不同
<div class="tabs">
<ul class="tabNavigation">
<li><a href="#content1">c1</a></li>
<li><a href="#content2">c2</a></li>
<li><a href="#content3">c3</a></li>
</ul>
<div id="content1">
content 1
</div>
<div id="content2">
content 2
</div>
<div id="content3">
content 3
</div>
我如何扩展它,使它给点击链接类“选择”?与预加载的内容版本类似
$(function() {
$("#tabs").tabs({
ajaxOptions: {
error: function(xhr, status, index, anchor) {
$(anchor.hash).html("Laadimisel ilmnes viga");
}
}
});
$('#tabs A').click(function(){
if($(this).hasClass('selected')){ return false; }
$('#tabs A.selected').removeClass('selected');
$(this).addClass('selected');
return false;
});
});
这很有效。您能用ajax版本的代码更新您的问题吗?这里的所有内容都是静态html版本。谢谢。使用ajax,html中唯一的变化是链接有href=“somepage.html”。还有我给出的javascript代码。内容加载工作正常,但我在为selecte tab提供自定义样式类时遇到问题。