jquery-ui accordion -如何动态创建新部分

jQuery UI Accordion是一个用于创建可折叠面板的jQuery插件。它允许用户在页面上创建一个垂直的可折叠菜单，其中每个菜单项可以展开或折叠其相关内容。

要动态创建新部分，可以按照以下步骤进行操作：

1. 引入jQuery和jQuery UI库：<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/ui/1.13.1/jquery-ui.min.js"></script> <link rel="stylesheet" href="https://code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
2. 创建一个HTML结构，用于容纳Accordion部分：<div id="accordion"> <!-- 这里是已存在的部分 --> <h3>Section 1</h3> <div> <p>内容1</p> </div> </div>
3. 使用jQuery UI Accordion初始化Accordion部分：$(function() { $("#accordion").accordion(); });
4. 使用jQuery的.append()方法动态创建新部分并添加到Accordion中：$(function() { $("#accordion").append('<h3>Section 2</h3><div><p>内容2</p></div>'); $("#accordion").accordion("refresh"); });

在上述代码中，我们使用.append()方法向Accordion中添加了一个新的部分，其中<h3>标签是部分的标题，<div>标签是部分的内容。添加完成后，我们使用.accordion("refresh")方法来刷新Accordion，以使新部分生效。

Accordion的动态创建可以用于各种场景，例如在用户点击某个按钮或触发某个事件时，根据需要添加新的部分。

腾讯云相关产品和产品介绍链接地址：

• 云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
• 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
• 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
• 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs