css начальной загрузки 3 в django работает не так, как ожидалось

#html #css #django #twitter-bootstrap #tabs

#HTML #css #django #twitter-bootstrap #вкладки

Вопрос:

Я пытаюсь использовать divs с вкладками в моем приложении django. Похоже, что переключатель работает так, как ожидалось, содержимое отображается при нажатии на следующую вкладку.

Но CSS, похоже, не работает. Когда я нажимаю на tab2, фокус по-прежнему находится на вкладке 1. На вкладке 2 кнопка отображается только серым цветом, и когда я нажимаю на другие части страницы, серый цвет исчезает, и даже если отображаются детали tab2, основное внимание уделяется вкладке 1.

Просто чтобы добавить сюда мои сценарии загрузки для страницы

 {% load bootstrap3 %}
{% bootstrap_css %}
{% bootstrap_javascript %}

При загрузке страницы я проверил исходники в chrome dev tools. В разделе источников я вижу, что загружены jquery и bootstrap.

1. Вы добавили зависимости для bootstrap 3? Это зависит от jquery для большинства виджетов, требующих анимации javascript. Если это так, сначала добавьте jquery, а затем добавьте bootstrap, поскольку он должен быть загружен перед начальной загрузкой

2. нет, я не знал, что они требуются, спасибо, что указали на это. то, что я сделал, это установил этот пакет django_static_jquery и объявил в установленных приложениях. кроме того, называется load static и указывает на статический каталог, как указано здесь . pypi.org/project/django-static-jquery но все равно не работает. или это то, что мне нужно сделать?

3. также я забыл, что у меня это объявлено в моем base.html .

Ответ №1:

Если ваш CSS не работает, попробуйте собрать статические файлы :

 python manage.py collectstatic

Ответ №2:

Я смог заставить это работать. Я думал, что библиотеки загружаются неправильно. В некотором смысле, из-за способа импорта библиотек, они, похоже, не работают должным образом.

вот как это выглядит в верхней части моего шаблона

 {% load static %}
{% load staticfiles %}
{% static 'static_jquery/js/jquery.js' %}

{% block content %}

    {% load bootstrap3 %}
    {% bootstrap_css %}
    {% bootstrap_javascript %}

Для меня это сработало так, что библиотеки, связанные с начальной загрузкой, должны быть размещены внутри содержимого блока. Раньше он помещался сверху после статических инструкций load.

А также мне пришлось удалить жестко закодированные теги скриптов в нижней части моего шаблона, тогда это сработало. Я удалил их

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script>

Другие вещи, которые я сделал, это установил django_static_jquery, затем выполнил collectstatic