So verwenden Sie Akkordeon in EasyUI-js-Tutorial-php.cn

So verwenden Sie Akkordeon in EasyUI

亚连

Freigeben： 2018-06-15 17:19:57

Original

2106 Leute haben es durchsucht

Jetzt werde ich Ihnen ein Anwendungsbeispiel für das jQuery EasyUI-Faltpanel-Akkordeon vorstellen. Es hat einen guten Referenzwert und ich hoffe, es wird für alle hilfreich sein.

1. Legen Sie class="easyui-accordion" für den Faltbereich p fest

2. Fügen Sie dem Bereich mehrere p hinzu, jedes p ist ein Bereich (jeder Bereich muss mit a festgelegt werden Titeleigentum).

3. Setzen Sie das Panel-Attribut fit auf true und passen Sie die Größe des übergeordneten Containers an

<!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">
    <p data-options="region:&#39;north&#39;,title:&#39;你我他学习吧-学习Java的好博客！&#39;" style="height:100px"></p>
    <p data-options="region:&#39;west&#39;,title:&#39;菜单导航&#39;" style="width:200px">
      <!--折叠面板-->
      <p class="easyui-accordion" data-options="fit:true">
        <p data-options="title:&#39;基础菜单&#39;">面板一</p>
        <p data-options="title:&#39;系统菜单&#39;">面板二</p>
      </p>
    </p>
    <p data-options="region:&#39;center&#39;,title:&#39;中部区域&#39;"></p>
    <p data-options="region:&#39;east&#39;,title:&#39;东部区域&#39;" style="width:100px"></p>
    <p data-options="region:&#39;south&#39;,title:&#39;南部区域&#39;" style="height:100px"></p>
  </body>
</html>

Nach dem Login kopieren

Das oben Gesagte habe ich für alle zusammengestellt. Ich hoffe, dass es in Zukunft für alle hilfreich sein wird .

Verwandte Artikel:

So implementieren Sie das Dialogfeld zum zeitgesteuerten Ausblenden in jQuery

So implementieren Sie die DIV-Verzögerungszeit in JS/jQuery Disappear oder nach Sekunden anzeigen

Verwenden Sie native js, um eine dreistufige Verknüpfung von Provinzen und Gemeinden zu realisieren

Das obige ist der detaillierte Inhalt vonSo verwenden Sie Akkordeon in EasyUI. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!