2013-03-03 73 views
0

我很清楚在這裏做錯了什麼,但我正在絞盡腦汁想弄明白。使用jquery添加下拉選項不起作用

所以我有一個<select></select>正是如此定義:

<select name="entryspeaker" id="entryspeaker"> 
    <option value="">No associated speaker</option> 
</select> 

然後在我的劇本,我定義的「揚聲器」對象的數組。我通過運行,我試圖將它們添加到列表中(如圖所示here),所以:

for (speakerIdx in speakerlist) { 
    var speaker = speakerlist[speakerIdx]; 
    var newOption = $('<option></option>').val(speaker.__id__).html(speaker.name); 
    $('#entryspeaker').append(newOption); 
    console.log(speaker); 
    console.log(newOption); 
} 

在檢查日誌中的speaker值,它肯定是獲取正確的對象,我也已經證實newOption值包含有效的<option>對象,但未將其正確添加到列表中。

有人能幫助這裏指出我的愚蠢?

在此先感謝!


編輯:它看起來像,這是由於使用Zurb基金會的自定義風格的下降列出了該網站。它似乎是在加載時複製原始列表,所以新項目不會被添加到複製列表中。我正在調查這一點,但這肯定是我的問題的原因。


編輯2 *:我找到了解決,這要歸功於this page。這似乎引發了「變革」的力量基金會重建列表:

$('#entryspeaker').change(); 
+0

請發佈你的數組。 – undefined 2013-03-03 20:43:24

回答

1

是越來越正確添加爲我與你的代碼.. Here是JS提琴

我用下面的陣列

var speakerlist=[{id:"1", name:"Rsquare"}, {id:"2", name:"Adi"}, {id:"3", name:"Anuj"}]; 

您是否遇到任何特定問題?我用鉻和IE9,它似乎工作正常。

+1

嗯......好奇。我也在使用Chrome瀏覽器,但沒有任何內容(默認設置除外)顯示。 其實......想到一個想法...我意識到,這個網站是使用Zurb基金會,自定義樣式下拉。我非常確定id是通過將下拉菜單複製到自己的自定義下拉菜單中,然後隱藏原始圖標來完成的。我相信我需要找到一種強制它在添加對象後重新創建自己的下拉菜單的方法。 感謝JS小提琴。它絕對幫助我排除了糟糕的js/html,並將基金會隔離爲原因。 – 2013-03-03 20:51:43

+0

你檢查的fiddle..it是有約束力的下拉,以及它正在登錄正確的對象......只要我打15的聲譽在IE9工作的罰款太.. – 2013-03-03 20:52:59

+0

,我一定會回來並upvote你的幫助! – 2013-03-03 20:54:56