Question

我有这个手风琴剧本：

$(document).ready(function(){
$(function(){
  //  Accordion Panels
  $(".accordion span").hide();

  $(".accordion li").click(function(){
      $(this).next(".pane").slideToggle("fast").siblings(".pane:visible").slideUp("fast");
  });
});
});

和这个PHP脚本：

echo "<u>Organizational Chart</u><br/>";
        echo "<div class='accordion'>";
$select_branch=mysql_query("SELECT * FROM branch");
while($result_branch=mysql_fetch_array($select_branch)){
    $branch1=$result_branch[1];
    if($branch1!='TOP'){
        echo "<li>".$branch1."</li>";
        echo "<div class='pane'>";
    }
    $select_department=mysql_query("SELECT * FROM departments");
        while($result_department=mysql_fetch_array($select_department)){
            $department=$result_department[1];
            $parent_department=$result_department[2];
            $select_staff=mysql_query("SELECT * FROM organization WHERE branch='$branch1' AND department='$department'");
                while($result_staff=mysql_fetch_array($select_staff)){
                    $fname=$result_staff[1];
                    $mname=$result_staff[2];
                    $lname=$result_staff[3];
                    $department=$result_staff[4];
                    $branch=$result_staff[5];
                    $position=$result_staff[6];
                    $status=$result_staff[7];
                    $pic=$result_staff[8];
                    echo "
                        <div class='staffDiv'>
                            <img class='staffPic' src='images/upload/".$pic."'/>
                            <div style='clear:both'></div>
                            <div class='staffDetails'>
                                ".$fname." ".$mname." ".$lname."<br/>
                                ".$position."<br/>
                            </div>
                        </div>
                    ";
                }
        }
    if($branch1!='TOP'){
        echo "</div>";
    }
}
        echo "</div>";

当我运行页面时，所有面板都打开，当我单击一个面板时，所有内容都将隐藏并开始正常工作，我该如何修复我的代码？我错过了什么。

我很抱歉这篇长篇帖子，我希望有人可以帮我解决这个问题。

Answer 1

默认情况下，尝试将active属性指定为false。为了它的工作，可折叠必须是真的。

$( ".accordion" ).accordion({ active: false, collapsible: true });

参考：http://api.jqueryui.com/accordion/#option-active

定制手风琴面板无法正常工作

1 个答案: