JQuery аккордеон закрыть затем открыть
Я настроил несколько аккордеонов на странице с помощью плагина jQuery accordion, чтобы я мог реализовать расширение всех и свернуть все функции.
каждый элемент ID - это собственный аккордеон, и код ниже работает, чтобы закрыть их все, независимо от того, какие из них уже открыты:
$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
.accordion("activate", -1)
;
моя проблема заключается в расширении all. Когда я их все разверну с помощью этого кода:
$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
.accordion("activate", 0)
;
некоторые будут сокращаться, а некоторые будут расширяться в зависимости от того, являются ли они ранее открыто.
моя идея исправить это состояла в том, чтобы свернуть их все, а затем развернуть их все, когда был нажат expand all. Однако этот код не будет выполняться должным образом:
$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
.accordion("activate", -1)
;
$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
.accordion("activate", 0)
;
он только ударит по второй команде и не закроет их все сначала. Есть предложения?
3 ответов
Я не совсем уверен, что вам нужно, но это мое лучшее предположение. Из всех ваших аккордеонов вы хотите, чтобы кнопка "Открыть все" открыла все аккордеоны, которые закрыты (то есть ни один раздел не отображается). Я бы сделал это, используя filter()
$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
.filter(":not(:has(.selected))")
.accordion("activate", 0)
;
это то, что вы искали?
Edit, чтобы объяснить эту функцию фильтра:
функцию фильтр выполняет текущий выбор через фильтр, удаляя все, что не совпадает. Оно имеет две разные формы: одна, где вы передаете обычный запрос jQuery, как я сделал выше, и другая, где вы можете определить функцию для фильтрации. Если функция возвращает false, то элемент удаляется.
в этом случае запрос удаляет все, что не (:not
) у (:has
) ребенок с классом "selected" (.selected
). Я использовал .selected
селектор здесь, потому что это то, что аккордеон добавляет к уже открытой панели.
если бы у вас был только один аккордеон, или вы дали каждому из ваших аккордеонов какой-то идентификатор, например имя класса, тогда вы могли бы значительно уменьшить весь сценарий. Допустим, для каждого элемента, который вы хотите превратить в аккордеон, вы даете ему класс "аккорд".
$(".accord:not(:has(.selected))").accordion("activate", 0);
это гораздо более разборчиво и ремонтопригодно, так как вы можете легко добавить больше аккордеонов в будущем, если хотите, и это будет обрабатывать его.
документация для фильтра здесь: http://docs.jquery.com/Traversing/filter
У меня была та же проблема, и я решил ее с помощью короткого кода, использующего каждую функцию JQuery (), чтобы свернуть, установив фокус на пункт [0], чтобы нормальная навигация могла возобновиться.