python Flask JQuery使用说明
普通情况下,位于static文件夹下(见图1 文件夹结构)。
本文结合一个很easy的加法样例试图说明Flask框架中JQuery和Ajax的使用方法。
强烈建议把全部的文件都保存为UTF8格式,以免产生中文乱码现象。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Flask JQuery</title>
<!-- 插入jquery -->
<script src="{{url_for('static', filename='jquery.js')}}"></script>
<script type=text/javascript>
var $SCRIPT_ROOT = {{request.script_root|tojson|safe}};
</script>
<script type=text/javascript>
$(function() {
function submit_form(e) {
$.getJSON($SCRIPT_ROOT + '/add', {
a: $('input[name="a"]').val(),
b: $('input[name="b"]').val(),
now: new Date().getTime()
},
function(data) {
$('#result').text(data.result);
});
};
// 绑定click事件
$('#calculate').bind('click', submit_form);
});
</script>
</head>
<body>
<p>
<input type=text size=5 name=a> +
<input type=text size=5 name=b> =
<span id=result>?</span>
</p>
<p><input type="button" id="calculate" value="计算"></p>
</body>
</html>
# -*- coding: utf-8 -*-
from flask import Flask, jsonify, render_template, request
app = Flask(__name__) @app.route("/")
def index():
# 主页面
return render_template("main.html") @app.route('/add')
def add_numbers():
a = request.args.get('a', 0, type=int)
b = request.args.get('b', 0, type=int)
return jsonify(result = a + b) if __name__=="__main__":
app.run(host = "0.0.0.0",port = 8080, debug = True)
全部IP地址均能够訪问,端口号为8080。而不是默认的80端口。

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveHVrYWk4NzExMDU=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="" />
python Flask JQuery使用说明的更多相关文章
- 前端和后端的数据交互(jquery ajax+python flask+mysql)
上web课的时候老师布置的一个实验,要求省市连动,基本要求如下: 1.用select选中一个省份. 2.省份数据传送到服务器,服务器从数据库中搜索对应城市信息. 3.将城市信息返回客户,客户用sele ...
- 细数Python Flask微信公众号开发中遇到的那些坑
最近两三个月的时间,断断续续边学边做完成了一个微信公众号页面的开发工作.这是一个快递系统,主要功能有用户管理.寄收件地址管理.用户下单,订单管理,订单查询及一些宣传页面等.本文主要细数下开发过程中遇到 ...
- Python Flask 在Sina App Engine (SAE)上安家
早就听说了Python的大名,随着的编程语言的理解加深,越发认为动态语言的威力--真大呀. 趁这段时间不忙,我也用Python写了一个应用,而且将其部署到Sina App Engine (SAE).S ...
- Python+Flask+MysqL的web技术建站过程
1.个人学期总结 时间过得飞快,转眼间2017年就要过去.这一年,我学习JSP和Python,哪一门都像一样新的东西,之前从来没有学习过. 这里我就用我学习过的Python和大家分享一下,我是怎么从一 ...
- #3使用html+css+js制作网页 番外篇 使用python flask 框架 (II)
#3使用html+css+js制作网页 番外篇 使用python flask 框架 II第二部 0. 本系列教程 1. 登录功能准备 a.python中操控mysql b. 安装数据库 c.安装mys ...
- #3使用html+css+js制作网页 番外篇 使用python flask 框架 (I)
#3使用html+css+js制作网页 番外篇 使用python flask 框架(I 第一部) 0. 本系列教程 1. 准备 a.python b. flask c. flask 环境安装 d. f ...
- [Python] Flask从0到1开发轻量级网页
概述 Flask采用MVT模型,即Model, Template, View Model:定义数据的存储格式,并且提供了数据库访问的API View:定义那些数据被显示,是业务逻辑处理模块 Templ ...
- 实验8、31个最重要的Python Flask面试问题和答案
实验介绍 1. 实验内容 内容涵盖了31个最热门的Flask面试问题,帮助学生更好的理解Flask. 2. 实验要点 了解面试Flask开发人员的常见问题 实验内容 Flask面试问答 Q:Flask ...
- 【Azure 应用服务】Azure App Service For Linux 上实现 Python Flask Web Socket 项目 Http/Https
问题描述 在上篇博文"[Azure 应用服务]App Service for Linux 中实现 WebSocket 功能 (Python SocketIO)"中,实现了通过 HT ...
随机推荐
- 2019手机号码JS正则表达式
前端的正则表达式验证往往是最繁多最复杂的,所以整理了一些最近自己常用的正则表达式,希望能对大家有所帮助! /* 合法uri */ export function validateURL(textval ...
- 2015 多校赛 第五场 1010 (hdu 5352)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5352 看题看得心好累. 题目大意: 给出 n 个点,依次执行 m 次操作:输入“1 x”时,表示将与 ...
- HBase编程 API入门系列之get(客户端而言)(2)
心得,写在前面的话,也许,中间会要多次执行,连接超时,多试试就好了. 前面是基础,如下 HBase编程 API入门系列之put(客户端而言)(1) package zhouls.bigdata.Hba ...
- OpenCV向JNI层的参数转换
九层之台,起于累土:千里之堤毁于蚁穴:成者半于九十.最近工程项目完全可以调试,却最后在 OpenCV向JNI层的参数转换 这个节点上遇到麻烦,看来得好好的思考一番,仔细寻找其中的纰漏. 一.实例 根据 ...
- C++对象的内存模型
1. 普通对象模型 对象是如何在内存中布局的? 成员 存放位置 访问范围 非静态数据成员 每一个对象体内 为该对象专有 静态数据成员 程序的静态存储区内,只有一份实体 为该类所有对象共享 成员函数(静 ...
- 团体程序设计天梯赛-练习集-L1-044. 稳赢
L1-044. 稳赢 大家应该都会玩“锤子剪刀布”的游戏:两人同时给出手势,胜负规则如图所示: 现要求你编写一个稳赢不输的程序,根据对方的出招,给出对应的赢招.但是!为了不让对方输得太惨,你需要每隔K ...
- jQuery默认select选择第一个元素
$("#id option:first").prop("selected", 'selected');
- 11.6 【Linq】分组和延续
11.6.1 使用 group...by 子句进行分组 class Program { static void Main(string[] args) { var query = from defec ...
- buildroot的make menuconfig配置
开始对buildroot 编译 [root@xxxxxx /data/sandbox/open_linux/buildroot] #make -j 20 Your Perl installation ...
- Google Shell Style Guide
转自:http://google.github.io/styleguide/shell.xml Shell Style Guide Revision 1.26 Paul Armstrong Too m ...