用jQuery ajax选项卡以不同的方式显示选定的选项卡
-
01-10-2019 - |
题
我的标签上有这样的预加载内容:
$(function () {
$('div.tabs ul.tabNavigation a').click(function () {
$('div.tabs ul.tabNavigation a').removeClass('selected');
$(this).addClass('selected');
return false;
}).filter(':first').click();
});
此添加的类=“选择”到链接和CSS选择选项卡的链接和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>
现在,我试图让Ajax上班。好吧,它正在工作,但是我让Troube class =“选择”到我的链接。
带有Ajax的JS功能看起来像这样:
$(function() {
$("#tabs").tabs({
ajaxOptions: {
error: function(xhr, status, index, anchor) {
$(anchor.hash).html("there was a problem");
}
}
});
});
如何扩展它,以便将单击的链接类“选定”给出?类似于预加载的内容版本。
解决方案
$(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;
});
});
这起作用了。
不隶属于 StackOverflow