Bootstrap預輸入名稱值對問題

Question

我有如下的JSON數據：

[{“ id”：1“ name”：“ firstName”}，{“ id”：2“ name”：“ secondName”}]

現在，我正在使用Bootstrap Typeahead 。 我想在“預先輸入”下拉列表中向用戶顯示“名稱”，但是我需要用戶在“選擇”框中使用的“名稱”所對應的“ id”。 我的要求是這樣的

<select>
   <option value="1">First Name</option>
   <option value="2">Second Name</option>
</select>

Answer 1

我不習慣於提前進行Bootstrap鍵入，但是在稍作搜索后看到其示例時，它們並沒有將數據顯示為選擇菜單。 他們將數據顯示為div標簽。 因此，我認為這不是您所需要的。

因此，我將分享這個jquery解決方案，以便從您提供的數據數組中創建所需的內容。

但是首先，您的數據數組是一個對象數組，因此在object元素和另一個元素之間，應該有一個逗號“，”，除了最后一個元素之外，這都是對的。

所以你的數組應該像這樣：

[ { "id": 1, "name": "firstName" }, { "id": 2, "name": "secondName" } ]

而且，從該數組中寫入所需的select標簽的jquery解決方案是：

var data=[ { "id": 1, "name": "firstName" }, { "id": 2, "name": "secondName" } ];
var el= document.createElement("select");
for (var i=0 ; i<data.length; i++){
    var child = "<option value='"+data[i].id+"'>"+data[i].name+"</option>";
    $(el).append(child);
}
document.body.appendChild(el); 

這是一件小事 。