Jquery 需要一组选项卡来激活两个容器
我正在尝试使用标签来激活左列中的尾声滑块和页面中心的标签内容。滑块已激活,但选项卡未激活 以下是页面顶部的jquery:Jquery 需要一组选项卡来激活两个容器,jquery,Jquery,我正在尝试使用标签来激活左列中的尾声滑块和页面中心的标签内容。滑块已激活,但选项卡未激活 以下是页面顶部的jquery: $(".tab_content").hide(); $("ul.tabs li:first").addClass("current_page_item").show(); $(".tab_content:first").show(); $("ul.tabs li").click(function() { $("ul.tabs li").removeClass("cur
$(".tab_content").hide();
$("ul.tabs li:first").addClass("current_page_item").show();
$(".tab_content:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("current_page_item");
$(this).addClass("current_page_item");
$(".tab_content").hide();
var activeTab = $(this).find('id').attr('a');
//alert(activeTab);
$(activeTab).show('slow');
return false;
}
我两个都试过了。attr('a');和.attr('id');但只有滑块触发,选项卡容器变为空白
我是新手,只是想学习javascript和jquery。我一直在很多论坛上阅读,但没有发现有人试图用一组标签激活两个标签或滑块容器
谢谢你的帮助
<div id="menu">
<ul class="tabs">
<li><a href="#0" class="xtrig" rel="coda-slider-1" id="tab0">Why Us?</a></li>
<li><a href="#1" class="xtrig" rel="coda-slider-1" id="tab1">CCW Class</a></li>
<li><a href="#2" class="xtrig" rel="coda-slider-1" id="tab2">Beginner</a></li>
<li><a href="#3" class="xtrig" rel="coda-slider-1" id="tab3">Advanced</a></li>
</ul>
</div>
var-activeTab=$(this.find('id').attr('a')
似乎必须是var-activeTab=$(this.find('a').attr('id')代码>这里有一个问题:
var activeTab = $(this).find('id').attr('a');
这将查找标记“id”的“a”属性和元素。HTML中没有
标记。我假设您试图在“this”中找到A标记:
在这方面:
$(activeTab).show('slow');
jQuery查找对象引用,因此不需要获取对象的ID,只需要获取对象本身,这就是为什么在$(this.find('a')
而且
如果您不是从其他地方调用正在查找返回值的函数,那么返回值是没有意义的。删除它就行了 这可以通过单击选项卡来启动尾波滑块和更改选项卡容器。
`
});
$(“.tab_content”).hide()//隐藏铝含量
$(“ul.tabs li:first”).addClass(“当前页面\项目”).show()//激活第一个选项卡
$(“.tab_content:first”).show()//显示第一个选项卡内容
//点击事件
$(“ul.tabs li”)。单击(函数(){
$(“ul.tabs li”).removeClass(“当前页面项目”);
$(this).addClass(“当前页面项目”);
$(“.tab_content”).hide();//隐藏所有内容选项卡
var activeTab=$(this.data('getTab');//获取html5数据元素
//var selectTab=“#”+activeTab;
//警报(activeTab);//调试
//$(activeTab.show('slow');
$(activeTab.fadeIn();
返回false;
});
`
它最多可以更改九个选项卡容器,并在左列中使用相应的coda滑块面板。
谢谢大家。你能把HTML也包括进来吗?我有一个tabs.js和3个其他jquery.js文档包含在coda slider中。下面是html。谢谢你的帮助代码“”返回false用于停止传播和默认行为。虽然我会使用传递给函数的事件对象上的方法,但当我找到可以使用的选项卡时,我将tabs.js添加到了网站中。然后我找到了滑块并添加了3个其他的.js文档。我认为如果左列信息可以更改以匹配页面的每个选项卡,那么它会工作得很好。我的原始页面有一英里长,我希望它更具可读性。这是在,但还没有现场直播,因为我仍在测试和调整。
$(activeTab).show('slow');
return false;
});
$(".tab_content").hide(); //Hide al content
$("ul.tabs li:first").addClass("current_page_item").show();//Activate first tab
$(".tab_content:first").show();//Show first tab content
//On Click Event
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("current_page_item");
$(this).addClass("current_page_item");
$(".tab_content").hide(); //hide all content tabs
var activeTab = $(this).data('getTab'); //get the html5 data element
//var selectTab = "#"+activeTab;
//alert(activeTab); //debugging
//$(activeTab).show('slow');
$(activeTab).fadeIn();
return false;
});
<ul class="tabs">
<li data-getTab="#content0"><a href="#1" class="xtrig" rel="coda-slider-1" >Why Us?</a></li>
<li data-getTab="#content1"><a href="#1" class="xtrig" rel="coda-slider-1" >CCWClass</a></li>
<li data-getTab="#content2"><a href="#2" class="xtrig" rel="coda-slider-1" >Beginner</a></li>
<li data-getTab="#content3"><a href="#3" class="xtrig" rel="coda-slider-1" >Advanced</a></li>