Flask jQuery ajax

最新推荐文章于 2024-07-30 17:23:09 发布

weixin_33711647

最新推荐文章于 2024-07-30 17:23:09 发布

阅读量106

点赞数

文章标签： python json javascript ViewUI

下面是jQuery官方给出的完整的Ajax事件列表：

$.post、$.get是一些简单的方法，如果要处理复杂的逻辑，还是需要用到jQuery.ajax()

一、$.ajax的一般格式

$.ajax({

type: 'POST',

url: url ,

data: data ,

success: success ,

dataType: dataType

});

二、$.ajax的参数描述

参数描述

url	必需。规定把请求发送到哪个 URL。
data	可选。映射或字符串值。规定连同请求发送到服务器的数据。
success(data, textStatus, jqXHR)	可选。请求成功时执行的回调函数。
dataType	可选。规定预期的服务器响应的数据类型。默认执行智能判断（xml、json、script 或 html）。

三、$.ajax需要注意的一些地方：

1.data主要方式有三种，html拼接的，json数组，form表单经serialize()序列化的；通过dataType指定，不指定智能判断。

2.$.ajax只提交form以文本方式，如果异步提交包含<file>上传是传过不过去,需要使用jquery.form.js的$.ajaxSubmit

通过 jQuery 使用 AJAX

300x108

flask-ajax-json

Flask 代码：

Code example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24	`# -- coding: utf-8 --` `"""` `ajax Example` `~~~~~~~~~~~~~~` `一个简单的应用，展示了 Flask 如果响应 JSON 数据。` `:copyright: (c) 2014 by Innes Luo.` `:license: BSD, see LICENSE for more details.` `"""` `fromflaskimportFlask, jsonify, render_template, request` `app=Flask(__name__)` `@app.route('/', methods=['POST','GET'])` `defindex():` `ifrequest.method=='POST':` `n=[request.form.get(x,0,type=float)forxin{'n1','n2','n3'}]` `returnjsonify(max=max(n),min=min(n))` `else:` `returnrender_template('index.html')` `if__name__=='__main__':` `app.run()`

模板代码：

Code example:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44	`<htmlxmlns="http://www.w3.org/1999/html"xmlns="http://www.w3.org/1999/html">` `<head>` `<metacharset="utf-8">` `<title>ajax Exampletitle>` `<scripttype=text/javascriptsrc="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.0.min.js">script>` `<scripttype=text/javascript.>` `var $SCRIPT_ROOT = {{ request.script_root\|tojson\|safe }};` `function ajaxForm(){` `$.ajax({` `type: 'post',` `url: $SCRIPT_ROOT,` `dataType: 'json',` `data:{` `'n1': $('input[name=n1]').val(),` `'n2': $('input[name=n2]').val(),` `'n3': $('input[name=n3]').val()` `},` `error: function(xhr, err){` `alert('请求失败，原因可能是：' + err + '！')` `},` `success: function(data, textStatus){` `$('#max').text(data.max);` `$('#min').text(data.min);` `}` `});` `return false` `}` `script>` `head>` `body>` `<h1>ajax Exampleh1>` `<formaction=""method="post"onSubmit="return ajaxForm()">` `<p>在下面 3 个文本框中输入数字，然后点击按钮。p>` `<inputname="n1"type="text"/>` `<inputname="n2"type="text"/>` `<inputname="n3"type="text"/>` `<inputtype="submit"/>` `<p>最大数：<spanid=max>?span>p>` `<p>最小数：<spanid=min>?span>p>` `form>` `body>` `html>`

Post函数未添加关键字。

r = requests.post('http://localhost:5000/login',json.dumps(values),headers);

具体参见：

http://www.python-requests.org/en/latest/user/quickstart/#more-complicated-post-requests

http://stackoverflow.com/questions/14112336/flask-request-and-application-json-content-type?rq=1

http://blog.csdn.net/iloveyin/article/details/21444613

关注