javascript - 在 select2 中添加带有文本的图像

标签 javascript jquery

嗯,我正在创建一个选择标签下拉列表,其中国家名称作为选项,我想添加受尊敬的国家国旗: 我使用了这个 HTML

    <div class="form-group" id="abc">
        <label class="col-md-2 control-label">Language: </label>
    <div class="col-md-6">
        <select class="select2me form-control" name = "locale" id="select_lang">
            @foreach($languages as $lang)
                <option value="{{$lang->locale}}" @if($lang->locale == $company->locale) selected="selected" @endif>{{$lang->language}}</option>
            @endforeach
        </select>
    </div>

使用的 JavaScript:

    jQuery(document).ready(function() {
          $.fn.select2.defaults.set("theme", "bootstrap");
          $('.select2me').select2({
             placeholder: "Select",
             width: '100%',
             allowClear: false
           });
     function format(state) {
                if (!state.id) return state.text; // optgroup
                return "<img class='flag' src='" + MyFILEPATH() + "flags/" + state.id.toLowerCase() + ".png'/>&nbsp;&nbsp;" + state.text;
            }
            $("#select_lang").select2({
                placeholder: "Select a Country",
                allowClear: true,
                formatResult: format,
                formatSelection: format,
                escapeMarkup: function (m) {
                    return m;
                }
            });
    });

最佳答案

我尝试过这个,效果很好:

$("#select_lang").select2({
    placeholder: "Select a Country",
    allowClear: true,
    templateResult: format,
    templateSelection: format,
    escapeMarkup: function (m) {
    return m;
  }
});

请尝试使用 templateResult 和 templateSelection 而不是 formatResult 和 formatSelection

关于javascript - 在 select2 中添加带有文本的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35200583/

相关文章:

javascript - 如何访问javascript中有空格的对象参数

jquery - 当旁边的另一个 div 扩展时如何防止 div 移动

jquery - 无法在 TreeView 中从 Font Awesome 切换类

javascript - 表单验证后启用提交按钮,如果单击提交按钮使用 jQuery 打开模式弹出窗口?

javascript - 访问 myfile.js.erb 中的 webpacker 帮助程序

javascript - 更新 Backbone 集合上的模型函数

javascript - 需要从 toDos 数组中删除 delItem 不知道如何

javascript - 向 Jquery 提供非匿名函数 : success + additional confusion

java - 循环播放一个网页

jQuery UI 的贪婪 droppable 无法按预期工作