多个引导选择加载非常慢

multiple Bootstrap-select loads very slow

本文关键字:加载 非常 选择      更新时间:2023-09-26

当我尝试在网站上放置多个选择(超过20个)时,它会减慢jquery的执行速度(带有停止/继续警报)-是否有机会优化代码以更快地加载它-加载需要几分钟时间?

样本代码

<td><select class="selectpicker" name="ref[240][sub_class]">
<option value=0 selected="selected" >A</option>
<option value=1>B</option></select></td>
<td><select class="selectpicker" name="ref[265][sub_class]">
<option value=0>A</option>
<option value=1 selected="selected" >B</option></select></td>

文件末尾的javascript:

        $(document).ready(function() {
  $('.selectpicker').selectpicker({
    style: 'btn-info',
    size: 1
  });
});

我也在使用引导选择。这个技巧解决了我在页面加载时关于引导选择渲染延迟的问题:似乎在页面加载中,dom元素通常在selectpicker之前渲染,这会使CSS"重新缩放",从而造成可怕的效果。

通常selectpicker第一次渲染需要500ms,你可以在元素定义后强制渲染,如下所示,避免这种延迟:

<select class="selectpicker" id="your_select">
   <option>...</option>
   ...
   <option>...</option>
</select>
<script>
   $("#your_select").selectpicker("render");
</script>

我想这有帮助:)

在我的情况下,简单地使用也是完全可以的

 $('.selectpicker').selectpicker();

$(document).ready(function() ...

对我来说,在加载js后立即强制渲染实际上会立即显示select,而不是等待整个页面加载:

<script src="~/assets/js/bootstrap-select.min.js"></script>
<script>
    $(".selectpicker").selectpicker();
</script>

对我来说,是引导冲突的问题。我在CMS Joomla中使用这个,所以从我加载的Bootstrap与另一个(从CMS)冲突。由于我删除了重复的文件-所有开始工作良好

问候OrdaSoft团队