javascript - 处理Python在JS文件中生成的JSON

标签 javascript jquery html flask

我是网络开发的新手。事实上,一周前我对此一无所知。现在我有一个由高级同事分配的项目。 使用python获取数据,python到javascript的桥梁是Flask,在main.py中。实际上,data 更长并且由其他函数返回,但格式为 jsonify()

@app.route("/")
def home():
    # JSON
    data = '{ "name":"John", "age":30, "city":"New York"}'
    response = render_template('home.html', data=data)

我的问题是如何在 JS 文件(例如 handle_data.js)中访问此 JSON data?我想根据这些数据制作一个高图表到我的 home.html Django Template Variables and Javascript这个对我不起作用。

最佳答案

如果您将 data 创建为字典而不是 Python 中的字符串,将会很有帮助,因为它很容易被 jinja2 模板引擎解释。 (此外,看起来您的数据已经 jsonified - 您提到数据是由另一个函数返回并由 jsonify() 格式化)。要访问 JS 文件中的数据变量,您首先需要在 View 中包含 js 文件(即 html 页面)使用标签。然后,在该脚本标记下,您需要将数据变量传递给 js 文件 (handle_bar.js) 中定义的函数

html 文件的示例代码:

<html>
<head>
<body>
Some text
<script src="path/to/handle_bar.js"></script>
<script>
loadData({{data}});
 </script>
</body>
</html>

现在你的handle_bar.js应该看起来像:

var myData;

function loadData(data){

myData = data;
console.log(myData);
}
//Use data freely in js file now using myData variable

关于javascript - 处理Python在JS文件中生成的JSON,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49247484/

相关文章:

javascript - 单击时使用 javascript 添加内容

javascript - 检查 javascript 函数中的 php 变量

jquery - 使用 jQuery UI 实现彩色动画

html - 有没有选择器排除显示: none elements?

javascript - 如何在 JS Web Worker 中循环查询 Worker 可用性而不阻塞

javascript - URI 正则表达式 : Replace http://, https ://, ftp://如果 URL 有效则为空字符串

javascript - jquery 单击事件不适用于 angular.js ng-repeat

javascript - 过滤仅文本文件的文件上传

javascript - Jquery Sortable 和 Draggable 在父子框架之间

Javascript - 大背景图像加载时间阻碍了我的 onLoad 功能