为什么我的Select2不能在Laravel项目中工作？

Question

在我的项目中，电影和演员、电影和类别之间有着多对多的关系。当我尝试创建一部电影，然后尝试使用Select2添加演员和类别时，它不会列出可用的选项（输入字段看起来是灰色的，好像它们被锁定了）。我查看脚本是否正在加载，它们是否正在加载。这是我的密码。

  MovieController:

  public function create()
  {  
    $actors = Actor::pluck('actor_name', 'id');
    $categories = Category::pluck('category_name', 'id');
    return view('movies.create', compact('actors', 'categories'));
  }

  create.blade.php:

       @extends('layouts.app')

       @section('title', '| Upload Movie')

       @section('stylesheets')

         {!! Html::style('css/select2.min.css') !!}

       @endsection

       @section('content')

         <div class="container">
            <div class="row">
                <div class="col-md-12">
                  <div class="row">
                    <div class="col-md-6">
                       {!! Form::open(['method'=>'POST', 'action'=> 'MovieController@store']) !!}
                      <div class="form-group">
                        {!! Form::label('movie_name', 'Name:') !!}
                        {!! Form::text('movie_name', null, ['class'=>'form-control'])!!}
                      </div>
                      <div class="form-group">
                        {!! Form::label('actor_id', 'Actors:') !!}
                        {!! Form::select('actor_id[]', $actors, null, ['class'=>'form-control select2-multi', 'multiple' => 'multiple']) !!}
                     </div>
                     <div class="form-group">
                        {!! Form::label('category_id', 'Category:') !!}
                        {!! Form::select('category_id[]', $categories, null, ['class'=>'form-control select2-multi', 'multiple' => 'multiple']) !!}
                     </div>
                     <div class="form-group">
                        {!! Form::submit('Upload Movie', ['class'=>'btn btn-primary']) !!}
                     </div>
                        {!! Form::close() !!}
                     </div>
                   </div>
                 </div>
             </div>
         </div>
         @endsection

         @section('scripts')

         {!! Html::script('js/select2.min.js') !!}

         <script type="text/javascript">

         $('.select2-multi').select2();

         </script> 

         @endsection

Answer 1

直接从选择2留档：

在DOM“就绪”之前，无法安全地对其进行操作。要确保在浏览器初始化Select2控件之前DOM已就绪，请将代码包装在$（文档）中。ready（）块。只有一美元（文档）。每页都需要ready（）块。

https://select2.org/getting-started/basic-usage

因此，您的代码应该是：

<script type="text/javascript">
    $(document).ready(function() {
          $('.select2-multi').select2();
     });
</script>