Question

我有一个通过模板文字创建动态div的功能，在每个div中我想添加一个select2选择过滤器，但是当我的页面中呈现动态div时，select2没有初始化，任何人都知道如何解决这个问题？下面是一个示例代码段：

javascript：

function render_report_grid(data){
            var details = `<select class="filter_select2 pull-right" 
                           id="filter_select2_${data.id}" multiple="multiple" name="select_project">
                           </select>`
}

$('.filter_select2').select2({placeholder: "Select parent",});

Answer 1

您应该在函数内添加启动部分，如：

function render_report_grid(data){
    var details = `<select class="filter_select2 pull-right" 
                  id="filter_select2_${data.id}" multiple="multiple" name="select_project">
                  </select>`

    $('.filter_select2').select2("destroy").select2({placeholder: "Select parent"});
}

因此，每当您添加新的选择标记时，您都会将其初始化为select2实例。

Answer 2

我认为问题在于您在将select2添加到页面之前创建了select2，所以当您这样做时：

$('.filter_select2').select2({placeholder: "Select parent"});

jquery选择器没有找到任何东西，所以你需要先将它添加到html：

var details = '<select class="filter_select2 pull-right" id="filter_select2_${data.id}" multiple="multiple"name="select_project"></select>';
$('some_jquery_selector').append(details);
$('.filter_select2').select2({placeholder: "Select parent"});

Select2不适用于动态div

2 个答案: