.toggle类。有可能吗?

时间:2012-10-08 15:34:20

标签: jquery

我上传了我的问题:my problem example

我的问题:在没有修改

的顺序的情况下,在加载页面之后(或刷新之后)可能首先显示'内容B def'
<a> href="..." C </a>
<a> href="..." B </a>
<a> href="..." A </a>

我想要C B订单。不是B C A或B A C. 我的javascripting知识是基本的,但它正在快速增长..

抱歉我的英文,

非常感谢您的建议! 我现在几天都在努力解决这个问题。

HTML code:

    <html>
   <head>
      <meta content="charset=utf-8" />
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
      <script defer src="js/swap.js"></script> 
   </head>
   <body>
      <div>
         <div id="view-c" class="swap-cont">
            <h1>content C xyz</h1>
         </div>
         <div id="view-a" class="swap-cont">
            <h1>content A abc</h1>
         </div>
         <div id="view-b" class="swap-cont">
            <h1>content B def</h1>
         </div>
         <div class="toggle">
            <a href="#view-c">C</a>
            <a href="#view-b">B</a>
            <a href="#view-a">A</a>
         </div>
      </div>
   </body>
</html>

swap.js:

    $(function() {
    var toggles = $('.toggle a'),
        codes = $('.swap-cont');

    toggles.on("click", function(event) {
        event.preventDefault();
        var $this = $(this);

        if (!$this.hasClass("active")) {
            toggles.removeClass("active");
            $this.addClass("active");
            codes.hide().filter(this.hash).show();
        }
    });
    toggles.first().click();
});​

1 个答案:

答案 0 :(得分:2)

您只需要更改脚本的最后一行:

toggles.first().click();

为:

toggles.eq(1).click();

此行通过触发单击默认锚点来初始化视图。

点击第一个锚点,即C. B实际上是第二个,因此您需要使用.eq()方法,该方法从中选择n-th元素设置并记录here

替代(清理)方法是将一个defaultAnchor类添加到默认锚点并将脚本修改为:

 $('.defaultAnchor').click();