CSS начальной загрузки 3 в Django не работает, как ожидалось - PullRequest
Новая
       43

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

1 голос
/ 15 апреля 2019

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

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

tabbable screenshot

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

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

При загрузке страницы,Я проверил источники в Chrome Dev Tools.В разделе источников я вижу, что загружены jquery и bootstrap.

sources

Ответы [ 2 ]

2 голосов
/ 15 апреля 2019

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

python manage.py collectstatic
1 голос
/ 16 апреля 2019

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

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

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

{% block content %}

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

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

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

<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

...