javascript - jQuery 只渲染一个选择框

Question

我有一个 jQuery 函数，它填充两个下拉列表，但目前只有一个呈现，另一个根本不呈现。但是，如果我更改顺序(renderGames 上方的 renderAccounts)，则始终是发生的第二个渲染。

代码如下:

 function renderCombos(games, accounts) {

    var renderGames = _.map(games, function (val) {
    return '<option>' + val + '</option>';
    }).join(); 

    $('select#gamescombo').html(renderGames).selectpicker('refresh');

    var renderAccounts = _.map(accounts, function (val) {
    return '<option>' + val + '</option>';
    }).join(); 

    $('select#accountscombo').html(renderAccounts).selectpicker('refresh');
 };

我不知道这是否相关，但我正在使用 Bootstrap 进行组合，但它们也没有正确显示，我收到错误:

Uncaught TypeError: Object [object Object] has no method 'selectpicker'

我的 HTML 是:

     <select class="selectpicker" id="gamescombo">
        <% _.each(games, function(item){ %>
        <option value="<%= item %>"><%= item %></option>
        <% });%>
    </select>   


    <select class="selectpicker" id="accountscombo">
        <% _.each(accounts, function(item){ %>
        <option value="<%= item %>"><%= item %></option>
        <% });%>
    </select>

有人知道我做错了什么吗？

有人知道吗？

Answer 1

try 
 var  renderCombos = function(games, accounts) {


    var renderGames = _.map(games, function (val) {
    return '<option>' + val + '</option>';
    }).join(); 

    return renderGames;
 };

$.when(renderCombos()).then(function(renderGames) {
   $('select#gamescombo').html(renderGames).selectpicker();
});