展开/折叠特定的 jpanels

Question

如何根据标题展开或折叠特定的JPanel或一些ID？

到目前为止，我可以使用按钮切换展开/折叠 JPanels。

//Assigning a click event on button to trigger expand/collapse JPanel
$('#triggerPanelBtn').click(function(){
    //alert($('.class').children('h3').attr("id"));
    $('.class').children('h3').trigger('click');
});

var panels="";  //Creating JPanels on the fly

var trs='<tr width="100%">'+
    '<th class="thPanel" align="left" width="40%">Database Type</th>'+
    '<td align="left" width="60%" style="word-break:break-all;">Something</td>'+
'</tr>'+
'<tr width="100%">'+
    '<th class="thPanel" align="left" width="40%">Database Version</th>'+
    '<td align="left" width="60%" style="word-break:break-all;">Something</td>'+
'</tr>';

panels+='<div title="Database Version" class="class">'+
    '<div class="jqUIDiv">'+
        '<table class="jpanelTable">'+
            '<tbody>'+trs+'</tbody>'+
        '</table>'+
    '</div>'+
'</div>';

panels+='<div title="ORS Databases" class="class" id="OrsDatabases">'+
    '<div class="jqUIDiv">'+
        '<table class="jpanelTable">'+
            '<tbody>'+trs+'</tbody>'+
        '</table>'+
    '</div>'+
'</div>';

panels+='<div title="Master Database" class="class">'+
    '<div class="jqUIDiv">'+
        '<table class="jpanelTable">'+
            '<tbody>'+trs+'</tbody>'+
        '</table>'+
    '</div>'+
'</div>';

$('#mainContent').empty();
$('<div>')
.html('<div>'+panels)
.appendTo('#mainContent').delay(10).queue(function(){
    $('.class').jPanel({
        'effect'    : 'fade',
        'speed'     : 'slow',
        'easing'    : 'swing'
    });      
});

Answer 1

您可以使用具有默认打开功能的最新 jPanel 版本 1.4，并指定要打开的面板，如下所示，

$('#wrapperId').jPanel({
    "defaultOpen"   :  true
            // other settings
});

或者如果您已使用类选择器初始化了面板，并且想要使用按钮上设置的标题单独打开一些面板，请单击您可以执行以下操作：你上面提到的。

Answer 2

最后我想出了一些对我有帮助的东西

$('#triggerPanelBtn').click(function(){
    $('.class').each(function() {  
            if($(this).attr("title")==="ORS Databases")  //I want to Expand/Collapse the JPanel having "ORS Databases" as it's Title
            $(this).children('h3').trigger('click');
    });
});