0

我有一个我正在处理的 django 项目，而且我对 Django 和 Python 很陌生。我制作了一个简单的模板，我的所有 css 和 js 文件都在 base.html 文件中调用，而我正在使用{% content block %}它来填写模板。

正在调用所有 css 文件以及所有 js 文件。我可以通过输入 /http://myurl://static/jsfile.js 来查看它们。CSS 文件也在我的 html 文档中工作。唯一不起作用的是任何 javascript，甚至不是嵌入式 javascript。

这是我的settings.py

# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'

# Additional locations of static files
STATICFILES_DIRS = (
# Put strings here, like "/home/html/static" or "C:/www/django/static".
# Always use forward slashes, even on Windows.
# Don't forget to use absolute paths, not relative paths.
'/djsite/djsite/static/',
'C:/djsite/djsite/templates/static/',
)

这是我的 urls.py

# 网站网址

from django.conf.urls.defaults import *
from djsite.views import *
from django.conf import settings

# Uncomment the next two lines to enable the admin:
from django.contrib import admin
admin.autodiscover()

urlpatterns = patterns('',
 # Main Pages
url(r'^$', 'django.views.generic.simple.direct_to_template', {'template': 'main/home.html'}),
(r'^about', 'django.views.generic.simple.direct_to_template', {'template': 'main/about.html'}),
(r'^profile', 'django.views.generic.simple.direct_to_template', {'template': 'network/user-home.html'}),                  
(r'^privacy', 'django.views.generic.simple.direct_to_template', {'template':     'main/privacy.html'}),   
(r'^contact/$', 'djsite.views.contact'),

# Uncomment the admin/doc line below to enable admin documentation:
url(r'^admin/doc/', include('django.contrib.admindocs.urls')),

# Uncomment the next line to enable the admin:
url(r'^admin/', include(admin.site.urls)),
)

这是我的这里是我的base.html（它有点长，我尽可能地切断了）

<head>
<title>{% block title %}{% endblock %}</title>

<script type="text/javascript">

    //initialize tabs
$(document).ready(function() {
    $('#tabs').tabs();
});

//initialize slider
$(document).ready(function(){
    $('#showcase').bxSlider({
        hideControlOnEnd: true,
        infiniteLoop: false,
    });
}); 

//for portfolio captions
$(window).load(function capTions(){ 
    $("a.caption").each(function(){
        $(this)
            .css({
                "height" : $(this).children("img").height() + "px",
                "width" : $(this).children("img").width() + "px"
            })
            .children("span").css(
                "width", $(this).width() - 10 + "px")
            .find("big").after('<div class="clear"></div>');
            $("a.caption").hover(function(){
                $(this).children("img").stop().fadeTo(500, .6);
                $(this).children("span").stop().fadeTo(500, 1);
            }, function(){
                    $(this).children("span").stop().delay(0).fadeOut(200);
                $(this).children("img").stop().delay(0).fadeTo(500, 1);
            });
    // End $(this)   
    });
});

$(document).ready(function () {
    $("[rel=tooltip]").tooltip({
        placement: 'bottom',
    });
    $("[rel=popover]").popover();
 });
</script>

<meta name="viewport" content="width=device-width, initial-scale=1.0">    
<meta name="author" content="Tyler Bailey">   
<meta name="description" content="" />    
<meta name="keywords" content="" />

<link rel="shortcut icon" href="/favicon.ico" />
{% load staticfiles %}
{% block addl_styles %}
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/network.style.css" />
{% endblock %}

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="{{ STATIC_URL }}libs/jquery.bxSlider.min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}libs/jquery-ui-1.8.22.custom.min.js"></script>  
<script type="text/javascript" src="{{ STATIC_URL }}libs/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/hirestarts.script.js"></script>

</head>

<body>
<div id="wrapper">
    <header>
        {% include 'includes/nav.html' %}
    </header>
<div class="contentContainer">
{% block content %}

{% endblock %}

主要是我现在担心的jquery-ui，但我不明白为什么CSS会加载，我可以查看/static/文件夹中的所有文件但是JS不起作用？

4

2 回答 2

2

一个明显的问题是您在实际加载 jQuery 之前调用了 jQuery 函数。要解决此问题，请将所有脚本加载调用移到您的内联 javascript之前：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="{{ STATIC_URL }}libs/jquery.bxSlider.min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}libs/jquery-ui-1.8.22.custom.min.js"></script>  
<script type="text/javascript" src="{{ STATIC_URL }}libs/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}js/hirestarts.script.js"></script>
于 2012-09-11T04:13:58.457 回答
0

我在 Django 项目中遇到了同样的问题。似乎 Chrome 在您刷新页面时不会获取文件，而是从缓存中加载它们。

如果你在 Chrome 中打开调试并查找你错过的静态文件 - 对我来说 - 它实际上就在那里，但里面有早期版本的代码。如果您右键单击它以在新选项卡中打开，它会显示其最新内容。

所以，对我来说，Chrome 中的Cmd + Shift + R 就很神奇。

于 2017-11-16T16:39:52.430 回答