76

我有一个名为的 HTML 文件showMap.html

<!DOCTYPE html>
<html>

<head>
  <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
  <title>Map</title>
  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">
  </script>
  <script type="text/javascript" src="js/map.js"></script>
</head>

<body onload="showPosition()">
  <div id="map_canvas" style="width:500px;height:500px;"></div>
</body>

</html>

另一个 JavaScript 文件map.js放在js同一目录的文件夹中。

此代码在加载 HTML 文件时工作正常,但当我在服务器中运行它时不起作用。

我使用 Python 的 Flask 框架进行后端编程,有趣的是,如果我在 HTML 文件中扩展 JavaScript 代码,同样的事情也会很好地工作。唯一的问题是外部文件。

4

4 回答 4

130

map.js文件作为静态资源提供

  • 将文件移动到static/包的子目录

  • 在 Jinja2 模板中为其生成一个静态 URL,如下所示:

     <script type="text/javascript"
             src="{{ url_for('static', filename='map.js') }}"></script>
    

filename参数采用相对路径;您可以使用子目录。

于 2013-02-05T15:57:43.693 回答
14

第 1 步: 在项目根目录上创建名称为 static 的文件夹

步骤 2: 在静态文件夹中添加静态文件

步骤 3 添加模板

<script type="text/javascript" src="{{ url_for('static', filename = 'hello.js') }}"></script>
于 2017-01-25T06:29:02.420 回答
0

我遇到了同样的问题,对于样式表,URL_FOR 有效,但适用于 javascript。我不得不写

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

它对我有用

于 2018-12-01T12:27:19.113 回答
-1

我想补充一下 Martijn 的答案,你必须像这样链接你的 js 文件:

<script type="text/javascript" src="{{ url_for('static', filename='map.js') }}"></script>

而不是这样:

<script type="text/javascript" src="{{ url_for('static', filename='map.js') }}"/>

于 2018-08-02T14:00:49.343 回答