Select2出现不正确

时间:2019-09-30 11:27:34

标签: jquery css jquery-select2

我无法正确显示select2。我有一个简单的代码,所有来自CDN的代码如下:

<!DOCTYPE html>
<html lang="sk">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
    <script   src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script> 
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" rel="stylesheet" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
    <style>
    </style>
</head>
<body>
<h1>Drom/index.php</h1>

<div class="container">
    <div class="row">
        <div class="col-xs-6">
            <form action="drom/index.php" class="form-group">
                <select name="type[]" id="x" class="form-control" id="frm-timeline-typeFilter-type" multiple="" data-autosubmit="1" data-select2-id="frm-timeline-typeFilter-type" tabindex="-1" aria-hidden="true">
                    <option value="contract" data-select2-id="3">Centrálny register zmlúv</option>
                    <option value="kataster" data-select2-id="4">Kataster</option>
                    <option value="kore" data-select2-id="5">Konkurzy a reštrukturalizácie</option>
                    <option value="likv" data-select2-id="6">Likvidácie a zrušenia</option>
                    <option value="debt" data-select2-id="7">Podlžnosti</option>
                </select>
            </form>
        </div>
    </div>
</div>  

<script>
    (function ($)
    {
        $('#x').select2();
    }(jQuery));
</script>
</body>
</html>

但是结果看起来像下面的截图: enter image description here 有人知道这有什么问题吗?您可以复制并粘贴所有代码,它将按原样工作。请帮我。它让我发疯...

编辑:有两个想法,但如果我删除第一个想法,则如下图所示:

enter image description here

0 个答案:

没有答案