php bootstrap selectpicker控件 下拉有几千条,太卡了,如何解决

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了php bootstrap selectpicker控件 下拉有几千条,太卡了,如何解决相关的知识,希望对你有一定的参考价值。

参考技术A get请求地址
url: basePath,
dataType: "json",
success: function (data)
var optArr = [];
for (var i = 0; i < data.length; i++)
$('.selectpicker').append("<option value=" + data[i].userName + ">" + data[i].userName + "</option>");


// 缺一不可
$('#name').selectpicker('refresh');本回答被提问者采纳

Bootstrap selectpicker - 如何动态添加 optgroup

【中文标题】Bootstrap selectpicker - 如何动态添加 optgroup【英文标题】:Bootstrap selectpicker - how to add opt group dinamically 【发布时间】:2021-12-20 15:58:07 【问题描述】:

我有一个数组,我需要创建一个带有外群的选择器。

我尝试在这段代码中使用 jQuery:

$.each(array, function(subindex, value) 
   if (subindex == 0)
    $('#select_template').append('<optgroup label="Camping">');
   

$('#select_template').append(
                                           $('<option />')
                                          .text('Frontpage')
                                          .val(j)
                                          .attr('coll_index', index)
                                          .attr('page_index', subindex)
                                          .attr('style', 'font-style: italic;')
                                          .attr('custom_page', 'true')
                                         
                                      ); c++;

if (subindex == value.length - 1)
    $('#select_template').append('</optgroup>');
   

);

但我得到的是:

<select>
<optgroup label="Camping"></optgroup>
<option value="0" coll_index="0" page_index="0" style="font-style: italic;" custom_page="true">Frontpage</option>
<option value="1" coll_index="0" page_index="1" custom_page="false">Page 1</option>
<option value="2" coll_index="0" page_index="2" custom_page="false">Page 2</option>
</select>

如何使用 jQuery 动态打开和关闭 optgroup?

【问题讨论】:

你能展示你的json结构吗? 【参考方案1】:

尝试在 $.each 循环之外创建 optgroup,例如 $('#select_template').append('&lt;optgroup label="Camping"&gt;&lt;/optgroup&gt;');

要附加到选项,只需在附加中引用 optgroup。例如:$('#select_template optgroup').append()

例如:

  $('#select_template').append('<optgroup label="Camping"></optgroup>');

  $.each(array, function(subindex, value) 
    $('#select_template optgroup').append(
      $('<option />')
      .text('Frontpage')
      .val(j)
      .attr('coll_index', index)
      .attr('page_index', subindex)
      .attr('style', 'font-style: italic;')
      .attr('custom_page', 'true'));
  )

如果您需要添加多个 optgroup,则需要提供 array 的数据

这是一个基本示例:https://jsfiddle.net/r2xpt3k6/

【讨论】:

以上是关于php bootstrap selectpicker控件 下拉有几千条,太卡了,如何解决的主要内容,如果未能解决你的问题,请参考以下文章

Bootstrap 4 selectpicker未以角度6显示

如何防止 Bootstrap 4 Selectpicker 打开

如何使用 bootstrap 中的 selectpicker 插件在选择时设置选定值

bootstrap中selectpicker下拉框使用方法实例

使用切换后的jquery bootstrap selectpicker blur

bootstrap selectpicker不使用angularjs动态数据加载下拉列表