Javascript 首先激活第二个选项卡

我有一个非常有名的脚本，我正在努力工作，目前一切都很好，但是当你第一次打开页面时，它会显示第一个选项卡，这是应该的，我想要的是它显示第二个选项卡。（第一个只是邮件撰写选项卡，第二个是实际的收件箱）

下面是javascript

    <script type="text/javascript">

$(document).ready(function() {

    //Default Action
    $(".tab_content").hide(); //Hide all content
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab
    $(".tab_content:first").show(); //Show first tab content

    //On Click Event
    $("ul.tabs li").click(function() {
        $("ul.tabs li").removeClass("active"); //Remove any "active" class
        $(this).addClass("active"); //Add "active" class to selected tab
        $(".tab_content").hide(); //Hide all tab content
        var activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
        $(activeTab).fadeIn(); //Fade in the active content
        return false;
    });

});

</script>

$（文档）.ready（函数（）{
//默认动作
$（“.tab_content”）.hide（）；//隐藏所有内容
$（“ul.tabs li:first”）.addClass（“active”）.show（）；//激活第一个选项卡
$（“.tab_content:first”）.show（）；//显示第一个选项卡内容
//点击事件
$（“ul.tabs li”）。单击（函数（）{
$（“ul.tabs li”）.removeClass（“active”）；//删除任何“active”类
$（this）.addClass（“active”）；//将“active”类添加到所选选项卡
$（“.tab_content”）.hide（）；//隐藏所有选项卡内容
var activeTab=$（this）.find（“a”）.attr（“href”）；//查找rel属性值以标识活动选项卡+内容
$（activeTab）.fadeIn（）；//淡入活动内容
返回false；
});
});

下面是选项卡的html

> <ul class="tabs">
>     <li><a href="#compose" class="compose"></a></li>
>     <div id="mail_sidebar_top">
>         <li><a href="#inbox" class="inbox">Inbox(0)</a></li>
>         <li><a href="#sent_mail" class="sent_mail">Sent Mail(0)</a></li>
>         <li><a href="#trash" class="trash">Trash(0)</a></li>
>         <li><a href="#reported" class="reported">Reported</a></li>
>         <li><a href="#drafts" class="drafts">Drafts</a></li>
>         
>     </div><!---end mail_sidebar_top--->
>     
>     <div id="mail_sidebar_middle">
>         <li><a href="#notifications" class="notifications">Notifications</a></li>
>         <li><a href="#alerts" class="alerts">Alerts</a></li>
>         
>     </div><!---end mail_sidebar_top--->
>    
>     </ul>

>

>     
>

>

>

>

>

>         
>     
>     
>     
>

>

>         
>     
>    
>

谢谢你的帮助

$(".tabs").tabs({
    selected: 1
});

---

有许多选项。

要显示第二个选项卡，请更改这些行

   $("ul.tabs li:eq(1)").addClass("active").show(); //Activate second tab
   $(".tab_content:eq(1)").show(); //Show second tab content

基本上，在当前版本中，当加载页面时，您可以基于jQuery选择器添加活动选项卡内容和类。由于html内容与选项卡的顺序相同，而不是对第一个实例使用选择器（即

：first

），因此我们可以将其更改为

：eq（1）

。（在本例中是这样，因为jquery引用数组中的DOM元素，所以第一个选项卡位于索引0，第二个选项卡位于索引1）。要在开始时显示不同的选项卡，只需将

：eq（1）

更改为

：eq（n）

，其中n是所需选项卡的数组索引

编辑更好的解决方案是使用jQuery提供的实际eq（）函数，因为它可以提高性能：

   $("ul.tabs li").eq(1).addClass("active").show(); //Activate second tab
   $(".tab_content").eq(1).show(); //Show second tab content

---

好的，很好，我使用了你的编辑版本，它工作得很好，我只是想我要添加的另一个功能是从页眉打开一个特定的选项卡，所以如果你使用

www.website.com/mail.php？tab_id=3

打开页面，那么它会打开第三个选项卡，有没有一种方法可以使用eq来实现这一点？其实不用担心这个评论，我只是想我可以使用php get来实现，然后将结果打印到eq中。如果您有任何其他解决方案，请让我知道，谢谢。要回答您的问题，是的，您可以决定使用php显示哪个页面。很抱歉，我已经有一段时间没有使用php了，但是我认为您可以使用php解析的变量并将其放入eq函数中。类似这样的内容：

$（“ul.tabs li”）.eq（）.addClass（“active”）.show（）只需确保$phpVar是一个int。