1

在这个 jsfiddle 中，我动态地添加#type了作为引导选择选择器的选项。一旦填充完毕，我将调用getMenus()它使用 ID 属性#type进行另一个 ajax 调用并填充第二个选择器的值，#filters.

第一个选择填充良好，但值未定义。无论我做什么，我似乎都无法让它识别选择中的选项。

加载页面后，如果我更改#type，则触发更改事件，并且一切都按应有的方式发生。它似乎只影响getType()页面首次加载时的首次运行。您能提供的任何帮助将不胜感激。

编辑： 看起来至少有一个问题与这一行有关：

$('#type').selectpicker('destroy').empty();

如果我删除了 destroy 方法，至少会显示选择，但它没有填充任何选项。

我将它添加到 init 函数中，现在它可以正常工作：

$(document).on('loaded.bs.select', '#type', function(){
    getMenus();
    console.log('getMenus completed');
});
$(document).on('loaded.bs.select', '#and-filter-0', function(){
    getOperators();
    console.log('getMenus completed');
});

我想知道这是否是完成这项工作的最佳方法，和/或是否存在任何其他问题，我只是在使用上述解决方案进行编码。

4

1 回答 1

0

你很亲密......它不起作用的唯一原因是因为 $('#type').append(options); getMenus 完成后被调用

因此，由于异步性质，选择属性被提前触发。当您使用提供的 API 时，loaded.bs.select' .it 给出了正确的回调

如果您希望您的 JSfiddle 代码正常工作，您可以使用承诺。我使用async :false作为临时解决方案。检查我的小提琴

我所做的只是

request = $.ajax({
      url: '/echo/json/',
      type: 'POST',
      contentType: 'application/json; charset=utf-8',
      async : false,
      dataType: 'json',
      data: {
        json: JSON.stringify(json)

所以结论是..使用内置的'loaded.bs.select'事件是最好的解决方案......这里有一些使用承诺的方法，但它会使代码冗长..所以你在正确的轨道上

于 2017-10-14T14:04:18.730 回答