Я попробовал простейший пример кода с использованием bootstrap-select:
<html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/css/bootstrap-select.min.css"> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/js/bootstrap-select.min.js"></script> </head> <body> <select class="selectpicker" data-live-search="true"> <option>Mustard</option> <option>Ketchup</option> <option>Relish</option> </select> </body> </html>
Запуск примера приведенного выше кода: https://jsfiddle.net/vpjnmatk/6/
Поле выбора не отображается в раскрывающемся списке, когдащелкнул.Я действительно запутался, так как думаю, что уже включил все необходимые зависимости.Есть идеи?
Включить popper.js до bootstrap.min.js
popper.js
bootstrap.min.js
<html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/css/bootstrap-select.min.css"> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script> <script src="https://unpkg.com/popper.js@1.14.3/dist/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.13.1/js/bootstrap-select.min.js"></script> </head> <body> <select class="selectpicker" data-live-search="true"> <option>Mustard</option> <option>Ketchup</option> <option>Relish</option> </select> </body> </html>
<script src="https://unpkg.com/popper.js@1.14.3/dist/umd/popper.min.js"></script>
Вам необходимо добавить в теги <head> следующее:
<head>
Вот проблема:
Вам нужен Popper.js