Question

我有一个HTML下拉菜单，工作正常，但它是完全静态的。即。手动输入菜单中的项目以匹配主页眉页面上的链接

例如。

<li><a class="tab" href="http://">INTERNAL</a>
<ul>
<li><a href=http://">Internal docs</a></li>
<li><a href="http://">SQL</a></li>
<li><a href="">Downloadables</a></li>
</ul>
</li>

菜单由3个链接组成，这些链接位于INTERNAL页面内。

如果我将任何部分添加到INTERNAL页面，我必须手动修改我的菜单以反映这一点，但如果我添加新页面，我希望自动添加此项目

可以这样做吗？我希望如此！

* *编辑：

更清楚这个问题;我有以下html：

<div id="category_2232" class="category">
<div class="column" id="forum_259962">
<h3 class="clearfix"><a href=""><span>Internal KB Documents</span></a></h3>
</div>
<div class="column" id="forum_20160368">
<h3 class="clearfix"><a href=""><span>Downloadable Extras</span></a></h3>
</div>
<div class="column" id="forum_20632406">
<h3 class="clearfix"><a href=""><span>SQL Scripts</span></a></h3>
</div>
</div>

我将其用作创建菜单的指南，其形式为：

<li><a class="tab" href="http://">INTERNAL</a>
<ul>
<li><a href="http://">Internal KB Documents</a></li>
<li><a href="http://">Downloadable Extras</a></li>
<li><a href="http://">SQL Scripts</a></li>
</ul>
</li>

我想接受第一个代码，每当我添加一个新的＆lt; div＆gt;时，我想要一个相应的＆lt; li＆gt;菜单上的条目将自动更新。

请帮忙！我太确定我能做到这一点！必须有一些JS可以生成菜单项....

非常感谢迄今为止所有参与者豪伊

Answer 1

当DOM准备就绪时，找到列表项并使用锚点文本创建可以附加到选择的选项元素。如果您在标记中添加一些ID，它将使查询DOM变得更加容易。

<强> Working Demo

<强>的jQuery

$(function () {
    var select = $('#internal-select');
    var items = $('#internal-list li a').each(function () {
        var text = $(this).text();
        select.append('<option value="' + text + '">' + text + '</option>');
    });
});

<强> HTML

<li><a class="tab" href="http://">INTERNAL</a>
    <ul id="internal-list">
        <li> <a href="http:// ">Internal docs</a></li>
        <li><a href="http:// ">SQL</a></li>
        <li><a href=" ">Downloadables</a></li>
    </ul>
</li>
<select id="internal-select"></select>

根据页面上列出的项目创建html下拉列表

1 个答案: