简体   繁体   English

Django-JavaScript无法在HTML页面上加载

[英]Django - javascript doesn't load on html page

My Django website won't load javascript files, but it does fine for the css part even tho both are in the same Static folder. 我的Django网站不会加载javascript文件,但是即使CSS和CSS都位于同一Static文件夹中,它对于CSS部分还是不错的。

base.html: base.html文件:

<head>
    {% load static %}
    <meta charset="UTF-8">
    <link href="{% static 'login/css/bootstrap.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'login/css/bootstrap.min.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'login/css/bootstrap-theme.css' %}" rel="stylesheet" type="text/css">
    <link href="{% static 'login/css/bootstrap-theme.min.css' %}" rel="stylesheet" type="text/css">
    <script src="{% static 'login/js/bootstrap.js' %}"></script>
    <script src="{% static 'login/js/bootstrap.min.js' %}"></script>

    <title>LOGIN</title>
</head>

settings.py: settings.py:

STATIC_URL = '/static/'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, "static"),
    ]

and here is the path to static folder: 这是静态文件夹的路径:

/home/nikola/Desktop/GIA/static

I've searched the google and solutions were pretty generic like something with the urls.py or python manage.py collectstatic (which is for deployment only), and none help. 我已经搜索过Google,并且解决方案非常通用,例如带有urls.pypython manage.py collectstatic的东西 (仅用于部署),没有帮助。 Im clueless. 我无能为力。

What seems to be the problem? 似乎是什么问题?

The js files are being loaded. js文件正在加载。 I think you're just not seeing the js plugins working because you haven't loaded the jquery file in your head block. 我认为您只是没有看到js插件正常工作,因为您尚未将jquery文件加载到head块中。 Afterall, bootstrap js plugins depend on jquery to work. 毕竟,bootstrap js插件依靠jquery起作用。

Also, in most practices, js files should be loaded at the end of the HTML file, before the closing </body> tag, because they tend to be big and you want your browser to load the smaller resources first before the js files get loaded. 另外,在大多数实践中,js文件应在</body>标记之前的HTML文件末尾加载,因为它们往往很大,并且您希望浏览器在js文件获得之前先加载较小的资源。加载。 Hence, your structure should look something like: 因此,您的结构应类似于:

<html>
    <head>
        <!-- meta stuff here -->
        <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script> <!-- jquery should always load before any other scripts -->
        <link href="css1.css" rel="stylesheet">
        <link href="css2.css" rel="stylesheet">
        ...
        ...
    </head>
    <body>
        ...
        ...
        <script type="text/javascript" src="{% static 'login/js/bootstrap.min.js' %}"></script>
    </body>
</html>
  1. make sure DEBUG = True in the settings.py 确保settings.py中的DEBUG = True
  2. keep the static folder in each app, when it is development, Django will search static file under each app. 将静态文件夹保存在每个应用程序中,在开发时,Django会在每个应用程序下搜索静态文件。 only publish to production ENV, the static folder which using python manage.py collectstatic will be config in the web server config. 仅发布到生产ENV,使用python manage.py collectstatic的静态文件夹将在Web服务器配置中进行配置。 if you are using nginx, etc/nginx/sites-enabled/config_file: 如果您使用的是nginx等,/ nginx / sites-enabled / config_file:

     root /.project_home/django_root; location /static/ { alias /.project_home/django_root/static/; } 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM