Question

我很难让select2 js lib在laravel中工作，在控制台中没有错误。我的刀片文件：

@extends('layouts.app')

@section('content')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<div >
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading">Dodaj nowy podmiot</div>
                <div class="panel-body">
                    <div >
                        <div>
                            <form>
                                <div class="form-group">
                                    <select class="js-example-basic-single">
                                        <option value="AL">Alabama</option>
                                        <option value="WY">Wyoming</option>
                                    </select>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
  $(".js-example-basic-single").select2();
</script>
@endsection

它只会更改项目的CSS，但即使它可点击也没有任何反应，它也不会显示选项，也不会显示下拉列表。

之前有没有人遇到类似的问题？

Answer 1

好的，我通过在布局刀片中注释这一行来解决这个问题：

<!-- <script src="{{ asset('js/app.js') }}"></script> !-->

因此，laravel中包含的默认js文件导致select2库出现问题。

感谢您的帮助

Answer 2

那是因为defer。

app.blade.php文件中的声明如下。

<script src="{{ asset('js/app.js') }}" defer></script>

在此删除defer并将其设为

<script src="{{ asset('js/app.js') }}"></script>

它将起作用

Laravel 5.4刀片和select2无法正常工作

2 个答案: