来自外部文件的Javascript未加载

时间：2012-03-16 11:43:28

标签： javascript python html django load

我有一个问题，Javascript一直困扰我很长一段时间。我有一个名为search.js的外部文件，它与加载的.html文件位于同一个文件夹中。

我在HTML中用来加载javascript文件的代码是：

<script type="text/javascript" src="search.js"></script>

在我读过的所有网站上，我都找不到代码的问题。

另外，我知道javascript文件中的语法必须正确才能正常工作，所以这是我的 search.js 的Javascript代码：

$(document).ready(function(){
    $('#searchForm').submit(function(){
        var lookfor = $("#billSearched").val();
        alert(lookfor);
        var a = $(this).attr('action');
        alert(a);
        a = a.replace("__search_term__",lookfor);
        alert(a);
        window.location.href = a;
        return false;
    });
});

我已经在另一个项目中运行了这个代码并且它运行得很好，所有我改变的都是字段的名称，即billSearched。

如果我的页面中没有加载Javascript的原因，请留言或留言。

提前致谢！

修改

完整的HTML代码：

<html>
<head>
    <title>Bills</title>
    <script type="text/javascript" src="/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/search.js"></script>
    <link rel="stylesheet" href="style.css"> 
</head>
<body bgcolor="#0066CC" color="FFFFFF">
    <table>
        <tr>
            <td style="color:white"><b>Products</b></td>
            <td style="color:white">Price</td>
            <form method="POST" id="searchForm"  action="{% url ps.views.search searchTerm='__search_term__' %}">
                {% csrf_token %}
                <td><input type="text" id="billSearched"></td>
                <td><input type="submit" value="Search"></td>
            </form>
        </tr>
        {% for x in products %}
        <tr>
        <td style="color:white">{{ x.name }}</td>
        <td style="color:white">{{ x.price }}</td>
        </tr>
        {% endfor %}
    </tr>
</table>
</body>

3 个答案:

答案 0 :(得分：3)

从标签和模板代码中，我收集到您正在使用Django。要了解您的问题，您必须了解Django查看相对于您的浏览器的工作方式，以及当您的浏览器发出给定网址请求时会发生什么。

Django方面会发生什么：

当您请求网址时会发生的情况是，您的基本urls.py文件将会搜索与您的网址匹配的模式。如果遇到模式，则会调用相应的view view将执行其逻辑，并使用template将其响应呈现为html。

从您的浏览器的角度来看会发生什么

浏览器请求了一个url，并收到了一个响应，它没有意识到一个视图被调用的事实，并且它在某处获取了一个模板。

这对您意味着什么

您的search.js文件位于模板旁边的事实完全不相关，因为您的浏览器从未请求此目录中的任何文件，这是view在获取template。

时发生了这种情况

实际上，您的浏览器对search.js的请求将由您的网络服务器转发至Django，并且（很可能）会导致404错误，除非search.js解析为urls.py中的视图。

如何使用它来解决您的问题

您需要从浏览器可以访问的目录中提供search.js文件。通常，这分三步完成：

  1. 配置您的网络服务器，使其自行提供以/static/开头的任何路径（不知何故，这意味着不会将请求转发给Django）。
    在Apache中，您将使用以下规则：Alias /static/ /YOUR/STATIC/DIRECTORY/

  2. 将Django的{​​{1}}配置为使用settings.py作为/YOUR/STATIC/DIR，STATIC_ROOT作为/static/。

  3. 将STATIC_URL文件放入search.js

  4. 使用/YOUR/STATIC/DIR/在src="/static/search.js模板中引用您的文件。

    5. 最后一件事：如果您正在使用开发服务器，则可能需要确保html以服务器的完整路径（包括端口）开始。 （或者您可能遇到浏览器安全策略问题）。

    一些补充：

    您应该使用模板标记，这样您就不必在模板中编写STATIC_URL 您应该使用/static/自动将静态文件放在静态目录中。

    最重要的是，你应该调查Django的MVC（或MTV）模型是什么。

答案 1 :(得分：0)

以/为前缀的路径指向根目录 - 而不是当前文件夹。在这种情况下，您要删除/前缀。

project/ps/templates/bill.html上链接JS脚本/search.js的HTML文件意味着它在完全错误的位置查找文件。

例如，如果您在HTML中添加指向/search.js的链接，则可以看到它如何解析路径。

为了便于说明，请在桌面上创建HTML文件：

<html>
<body>

<a href="/foobar.txt">Hello</a>
<a href="foobar.txt">World</a>

</body>
</html>

当您将鼠标悬停在该链接上时，您会看到Hello它解析为file:///foobar.txt而World会解析为您桌面的路径 - 在我的情况下为file:///C:/Users/thm.ARC/Desktop/foobar.txt。< / p>

答案 2 :(得分：0)

为了解决问题，我不得不混合你的答案，但最终还是修复了。我必须做出以下修改：

  • 将'/ static /'文件夹添加到settings.py文件中的STATIC_URL和STATICFILES_DIRS

  • 按以下顺序导入.js文件（search.js和jQuery源）：

    <script type="text/javascript" src="/static/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/static/search.js"></script>

  • 制作相应的文件结构，将“静态”文件放在项目的根目录中。

    即。 Psroot：

  • PSAPP
  • 静态
  • 模板
  • 和其他文件（settings.py，urls.py，manage.py等）
相关问题
最新问题