jQuery手风琴先关闭再打开 [英] Jquery Accordion Close then Open

问题描述

我已经使用jquery手风琴插件在页面上设置了许多手风琴，这样我就可以实现全部展开和折叠所有功能.

I've set up a number of accordions on a page using the jquery accordion plugin so I can implement expand all and collapse all functionality.

每个ID元素都是它自己的手风琴，下面的代码可以关闭所有手风琴，无论哪些已经打开:

Each ID element is it's own accordion and the code below works to close them all no matter which ones are already open:

$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
    .accordion("activate", -1)
;

我的问题是全部展开.当我把它们都扩展为以下代码时:

My problem is with the expand all. When I have them all expand with this code:

$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
    .accordion("activate", 0)
;

有些人会收缩，有些人会根据他们以前是否打开而扩张.

Some will contract and some will expand based on whether or not they are previously open.

我要纠正的想法是将它们全部折叠起来，然后在单击全部展开时将它们全部展开.但是，此代码无法正确执行:

My idea to correct this was to collapse them all and then expand them all when the expand all was clicked. This code however won't execute properly:

$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
    .accordion("activate", -1)
;
$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
    .accordion("activate", 0)
; 

它只会命中第二个命令，而不会先关闭它们.有什么建议吗?

It will only hit the second command and not close them all first. Any suggestions?

推荐答案

我不确定您要做什么，但这是我的最佳猜测.在所有手风琴中，您需要全部打开"按钮来打开所有已关闭的手风琴(也就是说，没有显示任何部分).我会使用filter()

I'm not exactly sure what you're after, but this is my best guess. Out of all your accordions, you want the "open all" button to open all the accordions which are closed (that is, no section is showing). I'd do that by using filter()

$("#contact, #address, #email, #sales, #equipment, #notes, #marketingdata")
    .filter(":not(:has(.selected))")
    .accordion("activate", 0)
;

那是你的追求吗?

编辑以说明该过滤器功能:

Edit to explain that filter function:

过滤器功能只是通过过滤器运行当前选择，删除所有不匹配的内容.它有两种不同的形式:一种是您传递常规的jQuery查询的形式，就像我在上面所做的那样，另一种是可以定义要过滤的函数的形式.如果该函数返回false，则该元素将被删除.

The filter function just runs your current selection through a filter, removing anything which doesn't match. It has two different forms: one where you pass a regular jQuery query in, like i did above, and the other where you can define a function to filter. If the function returns false, then that element is removed.

在这种情况下，查询将删除没有(:not)包含(:has)子类别为"selected"(.selected)的子项的所有内容.我在这里使用了.selected选择器，因为这是手风琴添加到当前打开的面板中的内容.

In this case the query removes anything which doesn't (:not) have (:has) a child with class "selected" (.selected). I used the .selected selector here because that's what the accordion adds to the currently-open panel.

如果您只有一个手风琴，或者为每个手风琴提供了某种标识符，例如类名，则可以大大减少整个脚本.假设对于要变成手风琴的每个元素，都给它一个手风琴"类.

If you only had one accordion, or you gave each of your accordions some sort of identifier, such as a class name, then you could greatly reduce the entire script. Let's say that for each element you want to turn into an accordion, you give it the class "accord".

$(".accord:not(:has(.selected))").accordion("activate", 0);

这更容易理解和维护，因为如果您愿意，将来可以轻松添加更多的手风琴，这样便可以解决.

This is much more legible and maintainable, since you can easily add more accordions in the future if you wish and this will handle it.

过滤器的文档在这里: http://docs.jquery.com/Traversing/filter

The documentation for filter is here: http://docs.jquery.com/Traversing/filter

这篇关于jQuery手风琴先关闭再打开的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！