javascript - select2 显示不正确(使用 cdn)

Question

我正在尝试使用一些 java 插件来完善我的网站，我在 Symfony 4 上并且使用 CDN bootstrap twitter。

当我将 select2 插件放入模板时，一切正常，select2 插件确实适用。

但是我不想直接从模板加载 select2 我想从 app.js 运行它但是它没有正常工作，select2 插件被激活但是它很奇怪，我'将在下面显示结果。

有我的app.js代码:

let $ = require('jquery');

require('../css/app.css');
require('select2');

$('select').select2();


console.log('Hello Webpack Encore! Edit me in assets/js/app.js');

抱歉我的英语不好，感谢大家看完我的文章!

Answer 1

您需要添加以下3个引用

$('select').select2({ width: '100%', placeholder: "Select an Option", allowClear: true });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" rel="stylesheet"/>


<select id='myselect'>
<option>Option 1</option>
<option>Option 2</option>
<option>Option 3</option>

</select>