English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
1、对折叠面板区域 div 设置 class=”easyui-accordion”
2、在区域添加多个 div， 每个 div 就是一个面板 （每个面板一定要设置 title 属性）。
3、设置面板属性 fit 为 true，自适应父容器大小
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>easyui-折叠面板accordion的使用</title>
!-- 导入jquery核心类库 -->
<script type="text/javascript" src="../js/jquery-1.8.3.js"></script>
!-- 导入easyui类库 -->
<link id="easyuiTheme" rel="stylesheet" type="text/css" href="../js/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../js/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css" href="../css/default.css">
<script type="text/javascript" src="../js/easyui/jquery.easyui.min.js"></script>
</head>
<body class="easyui-layout">
<div data-options="region:'north',title:'Tu, yo, él, sitio de aprendizaje'-¡Blog excelente para aprender Java!'" style="height:100px"></div>
<div data-options="region:'west',title:'navegación de menú'" style="width:200px">
!--Panel desplegable-->
<div class="easyui-accordion" data-options="fit:true">
<div data-options="title:'menú básico'">Panel uno</div>
<div data-options="title:'menú del sistema'">Panel dos</div>
</div>
</div>
<div data-options="region:'center',title:'región central'"></div>
<div data-options="region:'east',title:'región oriental'" style="width:100px"></div>
<div data-options="region:'south',title:'región sur'" style="height:100px"></div>
</body>
</html>
La siguiente es la instancia de uso del panel desplegable jQuery EasyUI accordion (compartida) que el editor comparte con todos ustedes, espero que les sea útil y esperamos que todos nos apoyen y alentemos el tutorial.
Declaración: El contenido de este artículo se ha obtenido de la red, es propiedad del autor original, el contenido ha sido contribuido y subido por los usuarios de Internet por su propia iniciativa, este sitio no posee los derechos de propiedad, no ha sido editado por humanos y no asume ninguna responsabilidad legal relacionada. Si encuentra contenido sospechoso de infracción de derechos de autor, por favor envíe un correo electrónico a: notice#w3Aviso: Al enviar un correo electrónico, por favor reemplace # con @ para denunciar y proporcionar evidencia relevante. Una vez verificada, este sitio eliminará inmediatamente el contenido sospechoso de infracción de derechos de autor.