Question

我有一个问题，当我运行此代码时，没有任何东西出现烧瓶服务器的原因，因为如果我停止服务器并更改网址（因为在烧瓶中它是静态的）它可以工作。

我的html / javascript代码：

<!DOCTYPE HTML>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Highcharts Example</title>

    <link href="/static/jquery.min.js" type="text/javascript" />
    <style type="text/css">
      <!-- ${demo.css} -->
    </style>
    <link href="/static/highcharts.js" type="text/javascript" />
    <link href="/static/exporting.js" type="text/javascript" />
    <script type="text/javascript" >
    $(function () {
    datasAxisX=['2014-10-07 23:43:19','2014-10-07 23:43:20','2014-10-07 23:43:20','2014-10-07 23:43:21','2014-10-07 23:43:23','2014-10-07 23:43:24','2014-10-07 23:43:24','2014-10-07 23:43:25','2014-10-07 23:43:25','2014-10-07 23:43:25','2014-10-07 23:43:25','2014-10-07 18:52:41','2014-10-07 18:52:41','2014-10-07 18:52:41','2014-10-07 18:52:42','2014-10-07 18:52:42','2014-10-07 18:52:42','2014-10-07 18:52:42'];

    datasAxisY = [296.134,275.982,281.109,273.363,292.042,274.022,286.898,271.463,279.182,279.805,272.717,272.192,268.225,270.166,271.432,270.803,275.939,272.748];

    $('#container').highcharts({
        chart: {
            type: 'spline'
        },
        title: {
            text: 'Statistiques sur la longueur des produits'
        },
        subtitle: {
            text: 'Du 23/09/2014 au 26/09/2014'
        },
        xAxis: {
            categories: datasAxisX,
            tickInterval: 5 /*on affiche l'abscisse tous les 5 points*/
        },
        yAxis: {
            title: {
                text: 'longueur (mm)'
            },
            min: 0,
            minorGridLineWidth: 0,
            gridLineWidth: 0,
            alternateGridColor: null,
            plotBands: [{ // zone bleue produit toléré variation longueur
                from: 6,  //val min tolérée
                to: 9,    //val max tolérée
                color: 'rgba(68, 170, 213, 0.1)',   //couleur de la zone
                label: {
                    text: 'variation longueur tolérée',
                    style: {
                        color: '#606060'   //ou c'est celle la la couleur de la zone?
                    }
                }
            }]
        },
        tooltip: {
            valueSuffix: ' mm' //unité lorsqu'on zoom sur un point particulier de la courbe (dans le carré qui apparait)
        },
        plotOptions: {
            spline: {
                lineWidth: 4,  //épaisseur de la courbe
                states: {
                    hover: {
                        lineWidth: 5 //aucune idée
                    }
                },
                marker: {
                    enabled: false
                },
            }
        },
        series: [{
            name: 'Longueur produit',
            data: datasAxisY

        }],
        navigation: {
            menuItemStyle: {
                fontSize: '10px'
            }
        }
    });
});
    </script>
  </head>
  <body>
    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>  
  </body>
</html>

我的server.py：

#! /usr/bin/python            
# -*- coding:utf-8 -*-               

from flask import Flask, json, request, render_template, jsonify
app = Flask(__name__)

@app.route("/addition", methods=['GET', 'POST'])
def get_data():
    return render_template('test.html')

if __name__ == '__main__':
    app.run(debug=True)

更新：

我的导演很好也许你不能把src放进烧瓶里？

├── server.py
├── static
│   ├── csvChart.js
│   ├── exporting.js
│   ├── highcharts.js
│   └── jquery.min.js
└── templates
    ├── test.html
    ├── test.html~
    ├── test_javascript_separate.html
    └── test_save.html

Answer 1

您正在使用<link> tags。链接标记不会加载代码，它们只能用于加载样式和标记导航和其他元数据关系。

改为使用<script> tags：

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

更好的是，让Flask为静态资源生成正确的URL：

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

请参阅Flask快速入门的Static Files section。

Flask jQuery不起作用

1 个答案: