У меня есть аккордеон, когда я щелкаю один раз, когда он расширяется (открывается), но пока я нажимаю снова, он не закрывает аккордеон. как изменить функцию, чтобы я мог закрыть аккордеон, когда я нажимаю второй раз на аккордеон.

$(function() {
  var icons = {
    header: "ui-icon-circle-arrow-e",
    activeHeader: "ui-icon-circle-arrow-s"
  };
  $("#accordion").accordion({
    icons: icons
  });
  $("#toggle").button().on("click", function() {
    if ($("#accordion").accordion("option", "icons")) {
      $("#accordion").accordion("option", "icons", null);
    } else {
      $("#accordion").accordion("option", "icons", icons);
    }
  });
});
<section class="content">
  <h1 style="color:#B94A7E"> header 1</h1>
  <div id="accordion">
    <h3 style="font-size:16px">header 3</h3>
    <div>
      <table>
        <tr>
          <td>
          </td>
        </tr>
        <tr>
          <td>
          </td>
        </tr>
        <tr>
          <td>
          </td>
        </tr>
        <tr>
          <td>
          </td>
        </tr>
        <tr>
          <td>
            <font color="#5a5453">
                                  4. The actual IoT platform that builds, connects and manages includes all APIs, Web services, application
                                  services, agents, connectivity etc
                              </font>
          </td>
        </tr>
        <tr>
          <td></td>
        </tr>
        <tr>
          <td>
          </td>
        </tr>
        <tr>
          <td>
          </td>
        </tr>
      </table>
    </div>
1
Swapna 9 Янв 2017 в 10:03

3 ответа

Лучший ответ

Быстрое исправление, установите collapsible:true в опции аккордеона. Например,

$("#accordion").accordion({
   collapsible: true
});

См. JsFiddle

3
Ataur Rahman Munna 9 Янв 2017 в 07:12

Аккордеон не позволяет открывать более одной панели контента одновременно. Читайте документацию по JQuery UI для Accordion. Обычно то, что вы хотите достичь, может быть написано с помощью нескольких строк кода JQuery, как показано ниже

$('#accordion').click(function() {
    $(this).next().toggle('slow');
});

демонстрация

0
Mayank Pandeyz 9 Янв 2017 в 07:09

http://jsfiddle.net/g8yoqmsL вставил ваш код и исправил в скрипте.

 $( "#accordion" ).accordion({
   collapsible: true
 });

Документы здесь http://jqueryui.com/accordion/#collapsible

0
justtry 9 Янв 2017 в 07:11