在页面加载时打开第一个手风琴答案

【问题标题】：Opening the first accordion on page load在页面加载时打开第一个手风琴
【发布时间】：2018-04-07 12:34:22
【问题描述】：

你能帮帮我吗？

如何在页面加载时自动打开第一个手风琴？使用javascript还是css都没关系。

代码笔：codepen.io/fainder/pen/AydHJ

我真的不知道该怎么做。我希望你明白我的意思。

非常感谢。

【问题讨论】：

标签： javascript css accordion

【解决方案1】：

好吧，很简单，你只需要在第一个<li>标签中添加“open”类，然后在子菜单中添加style="display:block;即可：

  <li class="open">
    <div class="link"><i class="fa fa-database"></i>Web Design<i class="fa fa-chevron-down"></i></div>
    <ul class="submenu" style="display: block;">
      <li><a href="#">Photoshop</a></li>
      <li><a href="#">HTML</a></li>
      <li><a href="#">CSS</a></li>
    </ul>
  </li>

检查这个：https://codepen.io/anon/pen/GxwraM

【讨论】：

【解决方案2】：

鉴于您的代码、简单的约束以及您使用 jQuery 的事实，最简单的解决方案是在文档加载时触发 first 匹配 .link 的 click。这应该在您的主要功能结束时发挥作用：

$(".link:first").click();

它又快又脏，应该可以完成工作。如果您在其他任何地方使用 .link 类，您可能需要使用更具体的选择器对其进行调整。

【讨论】：