Question

我正在通过数据库加载3级下拉列表的内容（与我的其他问题相同的项目 - 显然我只是学习语言，对不起）。我希望顶层像一个标签菜单，在它下面的空间周围有一个边框，其余的列表都会下降。但请检查我的代码：

<ul id="catsMenu">
    <cfloop query="getCats">
        <li><h2><span><cfoutput>#getCats.group_name#</cfoutput></span></h2>
            <ul>
                <cfloop query="getMain">
                    <li><cfoutput>#getMain.section_name#</cfoutput>
                        <ul>
                            <cfloop query="getDetail">
                                <li><a href="somelink"</a></li>
                            </cfloop>
                        </ul>
                    </li>
                </cfloop>
            </ul>
        </li>
    </cfloop>
</ul>

（我需要getdetail查询来了解它的链接）

我无法弄清楚如何在它下面的整个部分创建框。我应该在此列表代码之前或之后绝对定位div吗？不确定如何去做这件事。在此先感谢您的帮助。

编辑：这就是我要找的：

---------------------------------
| Tab 1 | Tab 2 | Tab 3 | etc.. |
---------------------------------
-----DIV W/ BORDER---------------
|  /* dropdown stuff            |
|     goes inside here */       |
|                               |
|                               |
|                               |
-------DIV W/ BORDER------------

Answer 1

您是否考虑过使用jQuery和jQuery-UI？ http://jqueryui.com/demos/tabs/

如果没有，那么你的cf代码似乎很好，你唯一需要做的就是用CSS做一点点。例如，第一个UL会有浮动，以保持它与页面的其余部分对齐，内部列表元素将具有浮动，也显示内联和一些填充，宽度，高度等...

以下是示例http://www.dynamicdrive.com/style/csslibrary/item/jquery_multi_level_css_menu_horizontal_blue/ http://daniel.glazman.free.fr/weblog/targetExample.html#others（使用firebug查看其完成情况）

如果我理解你的问题......

Answer 2

埃里克，

如果我理解你的问题是正确的，你应该使用cflayout和cflayoutarea标签。它可以轻松实现您在图像中显示的内容。

这个链接shud给你一个简单的例子。

http://coldfusion-example.blogspot.com/2009/03/how-to-use-cflayout-with-cflayoutarea.html

您可以使用“请求”范围将值从一个cflayoutarea传递到下一个，并通过ColdFusion.navigate（）提交父布局区域。

希望这会有所帮助

在动态加载列表时封装嵌套列表

2 个答案: