1

我一直在研究一个比我更高级的开发人员传给我的东西。(尽管他不擅长拼写)。我想要做的是,当点击一个主要类别时,它下面的列表会隐藏或显示。但最初是隐藏的。

他的代码将它们全部显示在一个整体框中,单击时成功隐藏并显示。所以这是一个框内的类别列表。如果这是有道理的。(有点像 yipit.com 左侧的框 - 单击标题使其下方的链接出现/消失)。所以这是他的代码:

<!-- Box2 -->
    <div class="clsBox clsTags" id="catgories_list">
        <!-- Box Title -->
        <div class="clsBox_Tiitt">
            <a href="javascript:void(0)">Categories</a>
        </div>
        <!-- End of Box Title -->
        <!-- Box content -->
        <div class="clsBox_Cont">
            <p class="clsBoxoption"><a href="javascript:void(0)" id="sel_my_tags">My Tags</a> | <a href="javascript:void(0)" id="clear_all_tag">Clear</a> | <a id="save_tags" href="javascript:void(0)">Save</a></p>
            <a href="javascript:void(0)" id="sel_all_tags" style="color:#fff; font-size:16px; font-weight:bold;">Select All</a>
            <?php
                if(isset($users_category))
                {
                    $mytags=implode(",",$users_category);
                    echo '<input type="hidden" name="my_tags" value="'.$mytags.'" id="my_tags"/>';
                }

                $sub_cat_query='';

                $sub_cats=array();

                $sub_categories=array();

                $conditions=array();

                $output="";

                $checked='';

                if(isset($categories))
                {
                    foreach($categories as $category)
                    {
                        $output.='<div class="clsTags_Cont">
                                    <h3>'.ucfirst($category->name).'</h3>
                                    <ul id="sub_cat_of_'.$category->id.'">';
                        $conditions=array("parent_id"=>$category->id,"status"=>'1');

                        $sub_cat_query=$this->common_model->getTableData("sub_category",$conditions);

                        $sub_categories=$sub_cat_query->result();

                        foreach($sub_categories as $sub_category)
                        {
                            if(count($users_category)!=0)
                            {   
                                if(in_array($sub_category->id,$users_category))
                                    $checked='checked="checked"';
                                else
                                    $checked='';
                            }
                            else
                                $checked='';

                            $output.='<li><label><input type="checkbox" id="check_box_cat'.$category->id.'_'.$sub_category->id.'" name="check_box_cat[]" value="'.$sub_category->id.'" '.$checked.'>&nbsp;'.ucfirst($sub_category->name).'</label></li>';
                        }
                        $output.="<div class='clear'></div></ul></div>";
                    }
                }
                echo $output;
            ?>
        </div>
        <!-- box Content -->
    </div>
    <!-- End of Box2 -->

而且我相信他用于该转换的代码是这样的:

$(".clsBox .clsBox_Tiitt").click(function(){
    var cur_id=$(this).parent().attr("id");
    $("#"+cur_id+" .clsBox_Cont").toggle();
    var class_name=$("#"+cur_id+" .clsBox_Tiitt").attr("class");
    if(class_name=="clsBox_Tiitt")
        $("#"+cur_id+" .clsBox_Tiitt").addClass("clsClsoe");
    else
        $("#"+cur_id+" .clsBox_Tiitt").removeClass("clsClsoe");
})

但是,呃,我不确定如何过渡。我知道我需要调整的一点是

$output.='<div class="clsTags_Cont">
                                    <h3>'.ucfirst($category->name).'</h3>
                                    <ul id="sub_cat_of_'.$category->id.'">';

我想我必须在前面放置一个特殊的 div,在 ul 位之前放置一个内部 div 类,然后在输出处将其关闭。

但是我有点不知所措,因为我将如何做到这一点,以便实际的隐藏/显示位出现和消失。

这有意义吗?希望我说得通。如果有人可以指导我,我将非常感谢您的帮助。我一直在学习!:) 首先十分感谢。

4

0 回答 0