首先李不显示活动内容

Question

嗨，我主要是一个设计师，但采取它在自己了解发生的事情引擎盖下帮我设计出更好的网站。

这是第一个网站，我已经设计并从头开始建立，所有被顺利，直到我打这个问题有UL里的活动状态。

下面是测试版的链接：http://www.philmckeith.com/stonebridge/2012/4-bedroom-house-the-york-bingley.html。

与下拉的框是嵌套内容目前。

HTML：

<div id="dd" class="wrapper-dropdown-2" tabindex="1"> 
<span>House Types</span> 
<ul class="dropdown"> 
    <li id="dd1"><a href="javascript:void(0);">Chester</a></li> 
    <li id="dd2"><a href="javascript:void(0);">Durham</a></li> 
    <li id="dd3"><a href="javascript:void(0);">York</a></li> 
    <li id="dd4"><a href="javascript:void(0);">Westminister</a></li> 
    <li id="dd5"><a href="javascript:void(0);">Ripon</a></li> 
</ul> 
</div> 

<div id="content1" class="content"><img src="images/new-homes-bingley-chester-plan.png"></div> 
<div id="content2" class="content"><img src="images/new-homes-bingley-durham-plan.png"></div> 
<div id="content3" class="content"><img src="images/new-homes-bingley-york-plan.png"></div> 
<div id="content4" class="content"><img src="images/new-homes-bingley-westminister-plan.png"</div> 
<div id="content5" class="content"><img src="images/new-homes-bingley-ripon-plan.png"></div> 

的Javascript选择：

$(document).ready(function() { 
//Active first link 
//var activeId = $(".active").attr("id").replace("dd",""); $("#content" + activeId).show(); 
$("#dd a").click(function() { 

    //reset 
$(".content").hide(); //Hide all content 
    $("ul.dropdown li:first").addClass("active").show(); //Activate first tab 
    $(".content:first").show(); //Show first tab content 
    $("#dd .active").removeClass("active"); 

    //act 
    $(this).addClass("active") 
    var id = $(this).closest("li").attr("id").replace("dd",""); 
    $("#content" + id).show(); 
}); 
}); 

的Javascript切换：

function DropDown(el) { 
      this.dd = el; 
      this.initEvents(); 
     } 
     DropDown.prototype = { 
      initEvents : function() { 
       var obj = this; 

       obj.dd.on('click', function(event){ 
        $(this).toggleClass('active'); 
        event.stopPropagation(); 
       }); 
      } 
     } 

     $(function() { 

      var dd = new DropDown($('#dd')); 

      $(document).click(function() { 
       // all dropdowns 
       $('.wrapper-dropdown-2').removeClass('active'); 

}); 
}); 

的风格UL下拉菜单中选择隐藏的内容确定，但不显示第一Li含量在页面加载。我在stackoverflow上找到的壁橱文章就是这个解决方案。 using jquery to change visibility of divs with nested content, onclick

我曾尝试以下，但没有运气作为尚未：

$('li').eq(0).addClass("active"); 

我猜我切换脚本和选择剧本是相互矛盾或重复莫名其妙，但不确定如何解决这个问题。任何帮助/建议/文章非常感谢。

Answer 1

尝试改变“JavaScript的选择”这样的：

（

$(document).ready(function() { 
    $("#dd a").click(function() { 
     //reset 
     $(".content").hide(); //Hide all content 
     $("ul.dropdown li:first").addClass("active").show(); //Activate first tab 
     $(".content:first").show(); //Show first tab content 
     $("#dd .active").removeClass("active"); 

     //act 
     $(this).addClass("active") 
     var id = $(this).closest("li").attr("id").replace("dd",""); 
     $("#content" + id).show(); 
    }); 
    $("#dd1 a").click();   // selects the first house type 
});