自上而下的菜單不顯示

Question

我正在為此實現使用引導程序。 因此，我遵循了從引導文檔創建自上而下菜單的指南。 該自上而下的菜單應包含一個房間列表。 菜單稱為“房間”。 我的Jade和Javascript文件在下面（僅執行自上而下的菜單）

editor.jade

extends layout

block header
script(src='/javascripts/editor.js')

block content
h1(id="title") Editor

h2 Editor: #{editorName}
.dropdown
 button#dropdownMenu1.btn.dropdown-toggle.sr-only(type='button', data-toggle='dropdown')
  | Rooms
  span.caret
 ul.dropdown-menu(role='menu', aria-labelledby='dropdownMenu1')
  #rooms
...

editor.js內（JavaScript的）

...
$.getJSON("/getContents", {theRoom: "roomList"},  function(room) {

   room.activeRooms.forEach(function(theExit){

       $('#rooms').replaceWith('<li  id="rooms" role="presentation">' + theExit+'</li>')
   });
});
...

不幸的是，屏幕上沒有顯示自上而下的菜單。 您能否看一下我的代碼並告訴我我做錯了什么？

PS：如果我的問題不清楚，請您告訴我，以便我詳細說明？

Answer 1

確保已填充http請求並調用了回調。 然后，將您的jquery部分替換為以下內容：

rooms.forEach(function(room){
    $('.dropdown-menu').append('<li role="presentation">' +room+' trolol</li>')
});

您現在要做的是將#rooms元素替換為forEach的第一個迭代，然后它不再存在，並且jquery找不到它。

http://jsfiddle.net/t6N9R/3/

（我使用在線轉換器之一將翡翠轉換為HTML）