首页
核心
实例
资源
关于
v1.0

Accordion 折叠面板

使用方法

使用ax-accordion表示使用折叠面板。与ax-panel格式类似。可参见演示效果。

                         <div axAccordion class="ax-accordion">
                            <div class="ax-item">
                                <div class="ax-panel-header">文字</div>
                                <div class="ax-panel-body">
                                    文字
                                </div>
                            </div>
                            <div class="ax-item">
                                <div class="ax-panel-header">文字</div>
                                <div class="ax-panel-body">
                                    文字
                                </div>
                            </div>
                            <div class="ax-item">
                                <div class="ax-panel-header">文字</div>
                                <div class="ax-panel-body">
                                    文字
                                </div>
                          </div>
                        </div>
中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius">
                                    <div class="ax-item">
                                        <div class="ax-panel-header">中华民族</div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>
                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header">历史进程</div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                        </div>
                                    </div>
                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header">人口规模</div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>
                                </div>

使用折叠箭头

ax-panel-header中的ax-panel-close即为关闭箭头按钮，与面板panel用法一样。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius">
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col">中华民族</div><span class="ax-operate ax-panel-close"><i class="ax-iconfont
ax-icon-up"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>
                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col">历史进程</div><span class="ax-operate ax-panel-close"><i class="ax-iconfont
ax-icon-up"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                        </div>
                                    </div>
                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col">人口规模</div><span class="ax-operate ax-panel-close"><i class="ax-iconfont
ax-icon-up"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>
                                </div>

多种抬头样式

配合使用ax-bar，ax-adorn，ax-more，ax-operate等样式可制作多种风格的抬头，其中ax-adorn和ax-more将随着折叠而旋转，请参见演示效果。

关于中国(右侧可使用连接按钮)
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
关于中国(右侧更多)
查看更多
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
关于中国(简单结构)
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
关于中国(简单结构)
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
关于中国(简单结构)
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。 
                                <div axAccordion class="ax-accordion ax-border ax-radius">
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">关于中国</span><span class="ax-color-ignore">(右侧可使用连接按钮)</span></div><a href="###" class="ax-operate"><i class="ax-iconfont
ax-icon-file-add"></i></a><a href="###" class="ax-operate"><i class="ax-iconfont ax-icon-link"></i></a><a href="###" class="ax-operate"><i class="ax-iconfont
ax-icon-cloud-upload"></i></a></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>
                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><i class="ax-adorn ax-iconfont ax-icon-star"></i><div class="ax-col"><span class="ax-title">关于中国</span><span class="ax-color-ignore">(右侧更多)</span></div><a href="###" class="ax-operate">查看更多<i class="ax-iconfont ax-icon-right"></i></a></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>
                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row ax-bar-left"><div class="ax-col">关于中国(简单结构)</div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                    </div>
                                    </div>

                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col">关于中国(简单结构)</div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>


                                    <div class="ax-break-line"></div>
                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><i class="ax-adorn ax-panel-close ax-iconfont ax-icon-right"></i><div class="ax-col"><b class="ax-title">关于中国(简单结构)</b></div></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                </div>

禁止item展开

禁止item有两个方法：

  • 1、给ax-itme使用disabled属性或者disabled="true"即可。
  • 2、使用插件disabled属性。
中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius">

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item ax-disabled">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-moree"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>


                                </div>

指定某item展开

给ax-accordion追加data-index=''属性即可，当然也可以写在js属性里。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius" data-index="2">

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>

                                </div>

另外可以对item使用ax-show类，或者使用active属性方法初始化显示指定item。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                    <div axAccordion class="ax-accordion ax-border ax-radius" data-active="#active">

                                        <div class="ax-item" id="active">
                                            <div class="ax-panel-header ax-row">
                                                <div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span>
                                            </div>
                                            <div class="ax-panel-body">
                                                <div class="ax-break-line"></div>
                                                <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                            </div>
                                        </div>

                                        <div class="ax-break-line"></div>

                                        <div class="ax-item ax-show">
                                            <div class="ax-panel-header ax-row">
                                                <div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span>
                                            </div>
                                            <div class="ax-panel-body">
                                                <div class="ax-break-line"></div>
                                                <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                            </div>
                                        </div>

                                        <div class="ax-break-line"></div>

                                        <div class="ax-item">
                                            <div class="ax-panel-header ax-row">
                                                <div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span>
                                            </div>
                                            <div class="ax-panel-body">
                                                <div class="ax-break-line"></div>
                                                <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                            </div>
                                        </div>


                                    </div>

全部展开

给ax-accordion使用data-collapse='false'属性即可，当然也可以写在js属性里。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius" data-collapse="false">

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>

                                </div>

显示多个

ax-accordion的data-multiple属性默认为true，即可显示多个；如果将data-multiple设置为false，那么手风琴折叠菜单同时只显示一个。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius" data-multiple="true">

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>


                                </div>

嵌套使用

在ax-panel-body中可重复使用ax-accordion以实现嵌套。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
中华人民共和国的成立
1949年10月1日中华人民共和国的成立，标志着中国进入了人民当家作主的新时期。
第三次国内革命战争
1945年8月至1949年10月是第三次国内革命战争时期。第三次国内革命战争是中国人民在中国共产党领导下反对国民党反动派的战争。
抗日战争
1937年7月7日，日军进攻卢沟桥，中国军队奋起还击，全国抗日战争的序幕由此揭开。8月13日，日军进攻上海，国民政府被迫对日作战。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius" data-index="1">

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                            <div axAccordion class="ax-accordion ax-border ax-radius ax-margin">
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华人民共和国的成立</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">1949年10月1日中华人民共和国的成立，标志着中国进入了人民当家作主的新时期。</div>
                                                    </div>
                                                </div>
                                                <div class="ax-break-line"></div>
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">第三次国内革命战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">1945年8月至1949年10月是第三次国内革命战争时期。第三次国内革命战争是中国人民在中国共产党领导下反对国民党反动派的战争。</div>
                                                    </div>
                                                </div>
                                                <div class="ax-break-line"></div>
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">抗日战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">1937年7月7日，日军进攻卢沟桥，中国军队奋起还击，全国抗日战争的序幕由此揭开。8月13日，日军进攻上海，国民政府被迫对日作战。</div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>


                                </div>

使用Cookie

通过使用参数cookie可自定义开启cookie（或给Accordion添加data-cookie属性和值），在刷新页面之后依然最后一次动作状态。如果同一个页面有个多个Accordion，并且都开启了cookie，那么cookie的值需要唯一。

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。 
                                <div axAccordion class="ax-accordion ax-border ax-radius" data-cookie="myacc">

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item ax-show">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                            <div axAccordion class="ax-accordion ax-border ax-radius ax-margin">
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华人民共和国的成立</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">1949年10月1日中华人民共和国的成立，标志着中国进入了人民当家作主的新时期。</div>
                                                    </div>
                                                </div>
                                                <div class="ax-break-line"></div>
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">第三次国内革命战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">1945年8月至1949年10月是第三次国内革命战争时期。第三次国内革命战争是中国人民在中国共产党领导下反对国民党反动派的战争。</div>
                                                    </div>
                                                </div>
                                                <div class="ax-break-line"></div>
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">抗日战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">1937年7月7日，日军进攻卢沟桥，中国军队奋起还击，全国抗日战争的序幕由此揭开。8月13日，日军进攻上海，国民政府被迫对日作战。</div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="ax-break-line"></div>

                                    <div class="ax-item">
                                        <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
ax-icon-right"></i></span></div>
                                        <div class="ax-panel-body">
                                            <div class="ax-break-line"></div>
                                            <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                        </div>
                                    </div>


                                </div>

更新参数

本插件可使用update方法更新参数，支持回调函数（无参数，可省略）。更新

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
JS HTML 
  • <script type='text/javascript'>
var paraInstance = new axAccordion('#para');
var btnPara = document.querySelector('#btnPara');
btnPara.onclick = function () {
    paraInstance.update({
        index: 1,
        multiple: true,
    }, function () {
        alert('更新了！');
    });
}
</script>
                        
  •                                             <div class="ax-accordion ax-border ax-radius" id="destroy">
            
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                                    </div>
                                                </div>
            
                                                <div class="ax-break-line"></div>
            
                                                <div class="ax-item ax-show">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                                        <div axAccordion class="ax-accordion ax-border ax-radius ax-margin">
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华人民共和国的成立</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1949年10月1日中华人民共和国的成立，标志着中国进入了人民当家作主的新时期。</div>
                                                                </div>
                                                            </div>
                                                            <div class="ax-break-line"></div>
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">第三次国内革命战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1945年8月至1949年10月是第三次国内革命战争时期。第三次国内革命战争是中国人民在中国共产党领导下反对国民党反动派的战争。</div>
                                                                </div>
                                                            </div>
                                                            <div class="ax-break-line"></div>
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">抗日战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1937年7月7日，日军进攻卢沟桥，中国军队奋起还击，全国抗日战争的序幕由此揭开。8月13日，日军进攻上海，国民政府被迫对日作战。</div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
            
                                                <div class="ax-break-line"></div>
            
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                                    </div>
                                                </div>
            
            
                                            </div>

摧毁实例

使用destroy方法可摧毁实例，支持回调函数（无参数，可省略）。摧毁

中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
JS HTML 
  • <script type='text/javascript'>
var destroyInstance = new axAccordion('#destroy');
            var btnDestroy = document.querySelector('#btnDestroy');
            btnDestroy.onclick = function () {
                destroyInstance.destroy(function () {
                    alert('实例摧毁了！');
                });
            }
</script>
                        
  •                                             <div class="ax-accordion ax-border ax-radius" id="destroy">
            
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                                    </div>
                                                </div>
            
                                                <div class="ax-break-line"></div>
            
                                                <div class="ax-item ax-show">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                                        <div axAccordion class="ax-accordion ax-border ax-radius ax-margin">
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华人民共和国的成立</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1949年10月1日中华人民共和国的成立，标志着中国进入了人民当家作主的新时期。</div>
                                                                </div>
                                                            </div>
                                                            <div class="ax-break-line"></div>
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">第三次国内革命战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1945年8月至1949年10月是第三次国内革命战争时期。第三次国内革命战争是中国人民在中国共产党领导下反对国民党反动派的战争。</div>
                                                                </div>
                                                            </div>
                                                            <div class="ax-break-line"></div>
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">抗日战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1937年7月7日，日军进攻卢沟桥，中国军队奋起还击，全国抗日战争的序幕由此揭开。8月13日，日军进攻上海，国民政府被迫对日作战。</div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
            
                                                <div class="ax-break-line"></div>
            
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                                    </div>
                                                </div>
            
            
                                            </div>

监听方法

借鉴jQuery的写法，本插件有若干监听方法，基本写法是：instance.on('shown',function(){})；具体事件说明如下：

  • load 实例初始化后执行
  • show item开始显示执行，支持参数index（当前页签索引）
  • shown item显示完毕执行，支持参数index（当前页签索引）
  • hide item开始隐藏执行，支持参数index（当前页签索引）
  • hidden item隐藏完毕执行，支持参数index（当前页签索引）
  • updated 参数更新后执行
中华民族
中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。
历史进程
中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。
人口规模
中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。
JS HTML 
  • <script type='text/javascript'>
var eventInstance = new axAccordion('#on');
            eventInstance.on('show', function(i) {
                alert('开始展开第' + i + '个ITEM');
            }).on('shown', function(i) {
                alert('展开完第' + i + '个ITEM');
            }).on('hide', function(i) {
                alert('开始折叠第' + i + '个ITEM');
            }).on('hidden', function(i) {
                alert('折叠完第' + i + '个ITEM');
            });
</script>
                        
  •                                             <div class="ax-accordion ax-border ax-radius" id="destroy">
            
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华民族</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。</div>
                                                    </div>
                                                </div>
            
                                                <div class="ax-break-line"></div>
            
                                                <div class="ax-item ax-show">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">历史进程</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国是世界四大文明古国之一，有着悠久的历史，距今约5000年前，以中原地区为中心开始出现聚落组织进而形成国家，后历经多次民族交融和朝代更迭，直至形成多民族国家的大一统局面。20世纪初辛亥革命后，君主政体退出历史舞台，共和政体建立。1949年中华人民共和国成立后，在中国大陆建立了人民代表大会制度的政体。</div>
                                                        <div axAccordion class="ax-accordion ax-border ax-radius ax-margin">
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">中华人民共和国的成立</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1949年10月1日中华人民共和国的成立，标志着中国进入了人民当家作主的新时期。</div>
                                                                </div>
                                                            </div>
                                                            <div class="ax-break-line"></div>
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">第三次国内革命战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1945年8月至1949年10月是第三次国内革命战争时期。第三次国内革命战争是中国人民在中国共产党领导下反对国民党反动派的战争。</div>
                                                                </div>
                                                            </div>
                                                            <div class="ax-break-line"></div>
                                                            <div class="ax-item">
                                                                <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">抗日战争</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                                <div class="ax-panel-body">
                                                                    <div class="ax-break-line"></div>
                                                                    <div class="ax-padding">1937年7月7日，日军进攻卢沟桥，中国军队奋起还击，全国抗日战争的序幕由此揭开。8月13日，日军进攻上海，国民政府被迫对日作战。</div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
            
                                                <div class="ax-break-line"></div>
            
                                                <div class="ax-item">
                                                    <div class="ax-panel-header ax-row"><div class="ax-col"><span class="ax-title">人口规模</span></div><span class="ax-operate ax-more"><i class="ax-iconfont
            ax-icon-right"></i></span></div>
                                                    <div class="ax-panel-body">
                                                        <div class="ax-break-line"></div>
                                                        <div class="ax-padding">中国疆域辽阔、民族众多，先秦时期的华夏族在中原地区繁衍生息，到了汉代通过文化交融使汉族正式成型，奠定了中国主体民族的基础。后又通过与周边民族的交融，逐步形成统一多民族国家的局面，而人口也不断攀升，宋代中国人口突破一亿，清朝时期人口突破四亿，到2005年中国人口已突破十三亿。</div>
                                                    </div>
                                                </div>
            
            
                                            </div>

参数汇总

名称 类型 默认值 说明
name string ax-accordion 自定义ax-accordion的样式
index number 空 载入是默认显示第几个页签，第一个用0表示，第二个用1表示；等同于标签data-index=''属性；标签属性优先，js属性次之，建议不要叠加使用。
cookie string 空 手风琴的cookie名。是否使用cookie保持打开状态，如果需要请填写当页唯一的cookie；等同于标签data-cookie=''属性；标签属性优先，js属性次之，建议不要叠加使用。
active string 空 设置手风琴初始化展开的item。可填'#id'、'.classname'或'node'。等同于标签data-active=''属性；标签属性优先，js属性次之，建议不要叠加使用。
disabled string 空 设置手风琴初始化禁止的item。可填'#id'、'.classname'或'node'。等同于标签data-disabled=''属性；标签属性优先，js属性次之，建议不要叠加使用。
collapse boolen true 设置手风琴默认是否折叠。默认为true折叠。使用false表示全部打开，当使用false时，index和cookie均失效。该参数等同于标签data-collapse=''属性；标签属性优先，js属性次之，建议不要叠加使用。
multiple boolen true 设置手风琴展开排他性。默认为true不排他，可同时显示多个页签。使用false表示一次只能打开一个页签。该参数等同于标签data-multiple=''属性；标签属性优先，js属性次之，建议不要叠加使用。
trigger string 'click' 设置手风琴展开动作。默认是'click'，可选择'mouseenter'。该参数等同于标签data-trigger=''属性；标签属性优先，js属性次之，建议不要叠加使用。

操作方法

名称 说明 参数说明 回调函数
init() 初始化 无参数 无回调函数
update(setting, callback) 更新所有参数 setting是用户自定义参数，是一个对象；callback是回调函数，可不填 function(){}
无参数
destroy(callback) 摧毁实例 无参数 function(){}
无参数
on(type, handler) 监听实例 type是监听事件，具体可看前文的：监听方法；handler是回调函数 function(){}
无参数
axInstance(axAccordions, name) 获取实例 axAccordion是当页创建的所有实例；name是指插件元素axAccordion属性的name值 无回调函数
在回调函数中this均指向实例本身，所以在回调函数中可默认使用如下变量：
  • this：实例本身
  • this.targetDom：Accordion的Dom
  • this.options：实例的参数