如何将其他元素添加到 JQuery 中手风琴的 header？

Question

我正在尝试创建一个包含 button-esk 元素的 header 手风琴，该元素将说明该部分中的项目数。

EXAMPLE OF THE HEADER I AM TRYING TO CREATE

我将如何处理 editing/adding 到 jquery-ui 以包含左侧文本和图标以外的其他元素。

如果你能简单地指出 jquery-ui 中的那一行就足够了。

我只是在寻找每句话的提示。我不是要构建那个 "number" 元素。只是简单地去哪里自己创建它。

Answer 1

看看 docs

<div id="accordion">
    <h3>Section 1 <span>**your number section could be here**</span></h3>
    <div>
       <p>foo</p>
    </div>
    <h3>Section 2 <span>**your number section could be here**</span></h3>
    <div>
       <p>foo</p>
    </div>
</div>

如果单击 <h3></h3> 中的任何内容，都会触发手风琴。您可以使用 css:

设置样式

#accordion h3 span { 
    background-color: black;
    color: yellow;
    padding: 5px;
    ....
}

Answer 2

<div id="accordion">

  <h3>Section 1    <span class="one">12</span></h3> <!-- these are your accordion header -->
  <div>
    ...
  </div>
  <h3>Section 2  <span class="two">29</span></h3>
  <div>
    ...
  </div>
  <h3>Section 3  <span class="one">can be text</span></h3>
  <div>
    ....
  </div>
</div>

now you have to add 

$( "#accordion" ).accordion();

你可以让它更动态，你必须使用 $.each 并且如果有列表你可以得到列表的编号并显示它们。

如何将其他元素添加到 JQuery 中手风琴的 header？

How do I add other elements to the header of an accordion in JQuery?

html

javascript

css

jquery

jquery-ui