我從http://css-tricks.com/convert-menu-to-dropdown得到了以下代碼,它非常適合將標準導航轉換爲選擇菜單。我想知道如何添加條件來處理子菜單。例如,這裏是一個WordPress導航創建默認HTML ...添加一個選項'子菜單'導航
<ul id='menu-collections'>
<li><a href='http://...'>blah</a>
<ul class='sub-menu'>
<li><a href='http://...'>blah</a></li>
</ul>
</li>
</ul>
而一個JS提琴,使事情變得更容易 - http://jsfiddle.net/eaDLX/
我想什麼做的是在前面加上「 - 」每UL具有一流的子菜單,使我的名單看起來像這樣...
選擇一種選擇......
編輯(這將是父母)
- 1920年集(這將是孩子)
廣告
- Baulmer收集
等等
我敢肯定,這將是做的相當簡單,但我無法做出邏輯上的飛躍。有人可以幫忙嗎?由於
// Create the dropdown base
$("<select />").appendTo("nav#menu-collections");
// Create default option "Go to..."
$("<option />", {
"selected": "selected",
"value" : "",
"text" : "Choose a Collection..."
}).appendTo("nav#menu-collections select");
// Populate dropdown with menu items
$("nav#menu-collections a").each(function() {
var el = $(this);
$("<option />", {
"value" : el.attr("href"),
"text" : el.text()
}).appendTo("nav#menu-collections select");
});
$("nav#menu-collections select").change(function() {
window.location = $(this).find("option:selected").val();
});
/* Hide existing menu */
$('nav#menu-collections ul').hide();
ID = 「菜單的集合」,這應該是不同的。 – Thulasiram