烧瓶HTML模板w/ Javascript
烧瓶HTML模板w/ Javascript
提问于 2014-10-07 14:08:55
我正在学习烧瓶，并试图在表格中显示财富500强公司的数据。
我已经正确地显示了这个表，现在我正在尝试按照任何一个列对表进行排序。看起来，我需要一些Javascript，它已经存储在我的静态目录中，但我不太清楚如何将javascript放入其中。
问题：
- 我有正确的框架吗？
- 如何正确利用javascript？
- 我读到过，我应该在base.html中的头上放任何脚本标签，有一次我不会这样做吗？
- 我有什么问题不应该问呢？
下面是我的文件结构
-app
--static
*sorttable.js
--templates
*base.html
*companies.html
--run.py
--views.py
--companies.csv下面是base.html
<html>
<head>
<script> src="{{ url_for('static', filename='sorttable.js', type='text/javascript') }}"</script>
{% if title %}
<title>{{ title }} - microblog</title>
{% else %}
<title>Welcome to microblog</title>
{% endif %}
</head>
<body>
<div>Microblog: <a href="/index">Home</a></div>
<div>Login: <a href="/login">Here</a></div>
<hr />
{% block content %}{% endblock %}
</body>
</html>下面是companies.html
{% extends "base.html" %}
{% block content %}
<table class="sortable">
<table>
<thead>
<tr>
<th> Revenues </th>
<th> Profits </th>
<th> Rank </th>
<th> Company </th>
</tr>
</thead>
{% for keys in companies %}
<tr>
<td> {{ keys.Revenues }} </td>
<td> {{ keys.Profits }} </td>
<td> {{ keys.Rank }} </td>
<td> {{ keys.Standard }} </td>
</tr>
{% endfor %}
<tfoot>
</tfoot>
</table>
{% endblock %}和run.py
# encoding: utf-8
from flask import render_template
from app import app
from .forms import LoginForm
@app.route('/companies')
def companies():
import csv
with open('companies.csv','rU') as f:
companies = csv.DictReader(f)
return render_template("companies.html",
title='Home',
companies=companies)回答 2
Stack Overflow用户
发布于 2014-10-07 15:28:11
我找到了如何让列表排序的答案
我将base.html中的行更改为：
<script> src="{{ url_for('static', filename='sorttable.js', type='text/javascript') }}"</script>至
<script src="{{ config.STATIC_URL }}/static/sorttable.js"></script>这似乎起作用了。
我很乐意从其他人那里得到关于如何改进的反馈。
Stack Overflow用户
发布于 2014-10-07 15:30:37
您的script标记不正确。您需要首先包含它的属性，而不是在script (<script>)之后关闭标记。
<script src="{{ url_for('static', filename='sorttable.js') }}"></script>type="text/javascript"是可选的，如果您使用HTML5 (<!doctype html>)，但不应该包含它。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26237999
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号