Bahtiar
@Bahtiar
Front-End developer

Не работает навигационная панель bootstrap на мобильных?

Я подключил последнюю версию bootstrap подключил как положено сначала jquery потом bootsrap.bundle.min.js но бутерброд который раскрывает меню на мобильных устройствах не работает в консоли выходит ошибка ? Всё правильно подключил но не хочет работать , кто может объяснить в чем проблема вот код

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
    <script src="node_modules/jquery/dist/jquery.min.js"></script>
    <script src="node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
    <title>Document</title>
</head>
<body>
    <div class="container">
        <nav class="navbar navbar-expand-md navbar-light bg-white">
            <img src="img/logo.png" alt="" srcset="" class="navbar-brand">
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
              <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
              <ul class="navbar-nav">
                <li class="nav-item active">
                  <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Features</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Pricing</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link disabled" href="#">Disabled</a>
                </li>
              </ul>
            </div>
          </nav>
    </div>
</body>
</html>


а здесь ошибка которая выводит консоль
collapse.js:346 Uncaught TypeError: Cannot convert object to primitive value
at RegExp.test ()
at HTMLDivElement. (collapse.js:346)
at Function.each (jquery.min.js:2)
at S.fn.init.each (jquery.min.js:2)
at S.fn.init.a._jQueryInterface [as collapse] (collapse.js:337)
at HTMLDivElement. (collapse.js:385)
at Function.each (jquery.min.js:2)
at S.fn.init.each (jquery.min.js:2)
at HTMLButtonElement. (collapse.js:381)
at HTMLDocument.dispatch (jquery.min.js:2)
  • Вопрос задан
  • 280 просмотров
Решения вопроса 1
Bahtiar
@Bahtiar Автор вопроса
Front-End developer
Вопрос решен. Почему то с выше 3.0.0 jquery не хочет совместно работать. Подключил jquery 3.0.0 и всё заработало
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@loonny
Прочитайте ошибку "Cannot convert object to primitive value" это переводится как "Невозможно преобразовать объект в примитивное значение", посмотрите строку на которой ошибка и тд. При всем желание никто вам не подскажет точно ничего, потому что вы для решения ошибки которая в JS предоставили HTML код.

Возможно вы зачем то изменили бутстраповские скрипты и напортачили, потому что я подключил все как у вас, и у меня нет ошибок.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы