Question

我有一个jQuery函数，它填充了两个下拉菜单，但是目前只有一个渲染，另一个根本没有呈现。但是，如果我更改顺序（renderAccounts在renderGames上面），它总是第二次渲染。

以下是代码：

 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进行组合并且它们也没有正确显示，我收到错误：

未捕获的TypeError：对象[object object]没有方法＆＃39; selectpicker＆＃39;

我的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();
});

jQuery只渲染一个选择框

1 个答案: