bsmselect用于在页面加载期间预选项目，并且无法控制顺序

bsmselect to preselect items during page load and cannot control order

本文关键字：项目 顺序 控制 选项 用于 加载 bsmselect      更新时间：2023-09-26

我正在使用bsmselect(https://github.com/vicb/bsmSelect)并具有以下javascript，以便在加载页面时预先选择项目。我使用的是web2py，{{=fill_messages_saved}}返回一个数组[4144142143]，这些数组都对应于我想要选择的选项的值。不幸的是，订单总是显示在我的html部分中生成的订单中。有没有一种方法可以在加载页面时根据值数组｛｛＝fill_messages_saved｝｝加载每个项作为预选选项？我可以用下面的alert（）单独查看每个项目的加载，但它们不会自上而下加载。。它们保留html中指定的顺序。当我手动选择选项时，它们会正确显示。

jQuery(document).ready(function(){
  jQuery(function($) {
  $("#fill_messages").bsmSelect({
    animate: true,
    highlight: true,
    plugins: [$.bsmSelect.plugins.sortable(), $.bsmSelect.plugins.compatibility()]
  });
});
$(window).load(function(){
  $.each({{=fill_messages_saved}}.toString().split(","), function(i,e){
    alert()
    $("#fill_messages option[value='" + e + "']").prop('selected', true).trigger('change');
  });
});

这是一个没有服务器端信息和html的repro案例。我希望它能按顺序用"鸡肉"、"绵羊"、"奶牛"answers"猪"预先填充列表[4，3，2，1]，但它显示为"猪"、"牛"、"羊"、"鸡肉"[1，2，4]。

jQuery(document).ready(function(){
   jQuery(function($) {
   $("#fill_messages").bsmSelect({
        animate: true,
        highlight: true,
        plugins: [$.bsmSelect.plugins.sortable(), $.bsmSelect.plugins.compatibility()]
      });
});
$(window).load(function(){
$.each([4,3,2,1].toString().split(","), function(i,e){
        alert()
        $("#fill_messages option[value='" + e + "']").prop('selected', true).trigger('change');
    });
});
<select name="fill_messages" id="fill_messages" multiple="multiple" title="Select a fill message">
  <option value=1>"Pig"</option>
  <option value=2>"Cow"</option>
  <option value=3>"Sheep"</option>
  <option value=4>"Chicken"</option>
</select>
相关文章：