2

hereのような複数の垂直メニューを探しています。ドロップメニューは必要ありません。私のmysqlデータベースでは、カテゴリに典型的なクロージャテーブル階層（先祖/子孫/深さ）を使用しており、それらをレンダリングしたいと考えています。データベースからすべての親と子を取得するには、次の方法があります。

   public function getSubtree($node) {
    $tree = $this->connection->query("
    SELECT c.*, cc2.ancestor, cc2.descendant, cc.depth
    FROM
        category c
        JOIN category_closure cc
        ON (c.cat_id = cc.descendant)
            JOIN category_closure cc2
            USING (descendant)
    WHERE cc.ancestor = $node AND cc2.depth = 1
    ORDER BY cc.depth, c.cat_id);

    return $this->parseSubTree($node, $tree);
}

private function parseSubTree($rootID, $nodes) {
    // to allow direct access by node ID
    $byID = array();

    // an array of parrents and their children
    $byParent = array();


    foreach ($nodes as $node) {
        if ($node["cat_id"] != $rootID) {
            if (!isset($byParent[$node["ancestor"]])) {
                $byParent[$node["ancestor"]] = array();
            }
            $byParent[$node["ancestor"]][] = $node["cat_id"];
        }
        $byID[$node["cat_id"]] = (array) $node;
    }

    // tree reconstruction
    $tree = array();
    foreach ($byParent[$rootID] as $nodeID) { // root direct children
        $tree[] = $this->parseChildren($nodeID, $byID, $byParent);
    }

    return $tree;
}

private function parseChildren($id, $nodes, $parents) {
    $tree = $nodes[$id];

    $tree["children"] = array();
    if (isset($parents[$id])) {
        foreach ($parents[$id] as $nodeID) {
            $tree["children"][] = $this->parseChildren($nodeID, $nodes, $parents);
        }
    }

    return $tree;
}

プレゼンターには次のものがあります。

$this->template->categories = $this->category->getSubtree(1);

また、私は Nette Framework を使用しているため、Latte テンプレート エンジンを使用しています。これは Smarty と非常によく似ています。親と子を持つすべてのカテゴリをレンダリングするには、次のようにします。

    <ul class="tree">
    {block #categories}
        {foreach $categories as $node}
            <li>
                <span">{$node["name"]}</span>
                <ul n:if="count($node['children'])">
                    {include #categories, 'categories' => $node["children"]}
                </ul>
            </li>
        {/foreach}
    {/block}
</ul>

私の最大の問題は、3 つ以上のレベルのメニューが必要な場合に css スタイルを作成する方法です。が選択されている場合、あるカテゴリはそのサブカテゴリが表示され、別のカテゴリは非表示になります。が選択されると、いくつかのサブカテゴリが彼のサブカテゴリを表示し、別のサブカテゴリが非表示になります。事前に本当にありがとう、私の英語で申し訳ありません。私が何を意味するか知っていることを願っています。

4

2 に答える 2

1

私がそれをよく理解していれば、ドロップダウンメニューが必要です。配置は垂直だと思います。サブカテゴリは、カテゴリの下または横にレンダリングする必要がありますか? 残りは表示されたままにする必要があることを理解しています。

于 2013-07-17T06:54:32.523 に答える
0

純粋に垂直にしたい場合は、onclick と JavaScript を使用する必要があります。ムースオーバーの場合は、これを試してください：

ul {

width: 200px;
position: relative;
list-style: none;
margin: 0;
padding: 0;

}

ウルリ{

background: #ccc;
border-bottom: 1px solid #fff;
position: relative;

}

ウルリウル{

position: absolute;
left: 200;
top: 0;
display: none;

}

ul li:hover ul {

display: block;

}

ウルリウルリ{

border-left: 1px solid #fff;

}

于 2013-07-17T07:31:47.630 に答える