Question

我正在使用带有Laravel Blade引擎的select2并且我将它用于loading remote data并且它的工作正常（从远程获取数据）但它看起来不像select2框。我还为我生成的select2附加了图像。

我的CSS文件包括以下部分

     {{--Bootstrap--}}
{{ HTML::style('css/bootstrap.css') }}
{{ HTML::style('css/bootstrap.min.css') }}
{{ HTML::style('css/plugin/font-awesome.min.css') }}
    {{--select2--}}
{{ HTML::style('css/plugin/select2/select2.min.css') }}
{{ HTML::style('css/plugin/select2/select2-bootstrap.css') }}

My Js文件在body标签

之后包含如下内容

{{ HTML::script('js/jquery.min.js') }}

{{ HTML::script('js/bootstrap.min.js') }}

{{ HTML::script('js/plugin/select2/select2.min.js') }}

{{ HTML::script('js/plugin/select2/select2.js') }}

我的HTML代码

<input type="hidden"  id="student-name-search"
 data-placeholder="Select Student" value="" data-option="" style="width:100%">  </input>

图片

enter image description here

Answer 1

您必须在HTML中使用选择输入，如下所示：

$(document).ready(function() {
  $(".js-example-basic-single").select2();
});

<select class="js-example-basic-single">
  <option value="AL">Alabama</option>
    ...
  <option value="WY">Wyoming</option>
</select>

select2未正确显示，如select2示例页

1 个答案: