下面我就为大家分享一篇jquery easyui 折叠面板accordion的使用实例，具有很好的参考价值，希望对大家有所帮助。

1、对折叠面板区域 p 设置 class=”easyui-accordion”

2、在区域添加多个 p， 每个 p 就是一个面板 （每个面板一定要设置 title 属性）。

3、设置面板属性 fit 为 true，自适应父容器大小

html>

  
    <meta>
    <title>easyui-折叠面板accordion的使用</title>
    <!-- 导入jquery核心类库 -->
    <script></script>
    <!-- 导入easyui类库 -->
    <link>
    <link>
    <link>
    <script></script>
  
  
    <p></p><div class="aritcle_card flexRow artxards">
											<div class="artcardd flexRow">
												<a class="aritcle_card_img" rel="nofollow" href="/xiazai/gongju/2331" title="jQuery 1.12.4"><img
														src="https://img.php.cn/upload/manual/001/431/639/6a21619eac924328.png" alt="jQuery 1.12.4" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
												<div class="aritcle_card_info flexColumn">
													<a rel="nofollow" href="/xiazai/gongju/2331" title="jQuery 1.12.4" class="overflowclass">jQuery 1.12.4</a>
													<p class="overflowclass">jQuery 1.12.4是jQuery 1.x系列的最后一个正式稳定版本，由jQuery团队于2016年发布。该版本主要面向需要兼容旧版浏览器环境的网站和Web应用，尤其适用于仍需支持Internet Explorer 6、Internet Explorer 7、Internet Explorer 8等老旧浏览器的项目。</p>
												</div>
												<a rel="nofollow" href="/xiazai/gongju/2331" title="jQuery 1.12.4" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
												</a>
											</div>
										</div>
    <p>
      <!--折叠面板-->
      </p><p>
        </p><p>面板一</p>
        <p>面板二</p>
      
    
    <p></p>
    <p></p>
    <p></p>
  

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

在jQuery中如何实现定时隐藏对话框

在JS/jQuery中如何实现DIV延时几秒后消失或显示

使用原生js实现省市区三级联动