Question

我有关于使用JQuery的可折叠面板的这个简单问题。我有一个左侧面板（从上到下）有一个菜单和一个包含表单元素的底部面板左侧和底部面板都是collapsibe，不得重叠。问题是，当我折叠左侧面板时，底部面板应扩展到整个宽度，反之亦然。

有人可以指点我这方面的任何一个例子吗？我找不到一个。感谢

Answer 1

首先，你的问题不是很清楚，概念也很模糊。但要实现您的要求，您应该使用jQuery UI，动画应该是accordian()。这也可以通过slideUp()＆amp;的组合来实现。 slideDown()功能。

下面是div元素的示例点击事件，我在其中使用切换＆amp;向上滑动（）。

//click function for expanding event 
$(document).on('click',".bill-description",function()
{
    //close all elements other than the clicked one 
    $("element list").not($(this).next("clicked element")).slideUp(600);
    //open the clicked element
    $(this).next("clicked element").slideToggle(600);

});

上述功能是为自定义手风琴效果而编写的。要了解手风琴效果，请阅读this.

第一行用于关闭非单击的所有元素。因此not。然后第二个用于打开被点击的元素。

Answer 2

你在使用一些手风琴/崩溃插件（即：jQueryUI）吗？

如果您只想使用jQuery，可以使用.show()，.hide()和/或.toggle()完成此操作。

$('.btn').click(function(){
    $('#panel1,#panel2').toggle();
})

Demo

JQuery可折叠面板协同工作

2 个答案: