这篇短文使用jquery。

　　Flask提供一个很简单的方法来处理Ajax请求——在视图函数中用request的属性is_xhr来判断，如果是true则是异步请求。

　　Jquery的$.getJSON()方法会主动向服务端发出ajax请求（不知这个理解是否正确？），服务端响应后调用$.getJSON的回调函数。在回调函数中就可以操作Html页面上的元素了。

客户端：ajax.html

<!doctype html>

<html lang="en">

  <head>

    <meta charset="UTF-8"/>

    <title>Document</title>

    <link href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>

  </head>

  <body>

    <h1>Ajax</h1>

    <div id="test">Show data count:</div>

    <script src="//cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script>

    <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <script>

     $(document).ready(function(){

       $.getJSON('/ajax',function(data){

     $('#test').append('<span class="badge">'+data.count+'</span>');

       });

     });

    </script>

  </body>

</html>

服务端：

@app.route('/ajax')

def y():

   if request.is_xhr:

       y = Area.query.all()

       return jsonify({'count':len(y)})

   return render_template('ajax.html')

--End--

Flask与Ajax的更多相关文章

  1. 教你如何使用flask实现ajax数据入库

    摘要:在正式编写前需要了解一下如何在 python 函数中去判断,一个请求是 get 还是 post. 本文分享自华为云社区<[首发]flask 实现ajax 数据入库,并掌握文件上传>, ...

  2. Flask jQuery ajax

    http://www.runoob.com/jquery/jquery-ref-ajax.html http://jun1986.iteye.com/blog/1399242 下面是jQuery官方给 ...

  3. flask jQuery ajax 上传文件

    1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...

  4. flask使用ajax提交表单

    Flask中使用ajax提交表单刷新数据,避免提交表单后使用return render_temp()会刷新页面 <form id ="test_form"> {{ fo ...

  5. flask使用ajax上传图片或者文件

    function upload_cover(){ var cover = new FormData(); var fileObj = document.getElementById('cover'). ...

  6. 网易新闻实战 --- flask,ORM, Ajax异步删除

    项目概述: 包含功能: 前端-- 新闻首页 新闻分类页 新闻详情页 后端-- 后台新闻管理(列表,分页) 新增新闻 修改新闻 删除新闻(AJAX)

  7. jquery+flask+keras+nsfw快速搭建一个简易鉴黄工具

    1. demo 地址:http://www.huchengchun.com:8127/porn_classification 接口说明: 1. http://www.huchengchun.com:8 ...

  8. flask学习导航主页

    我就学习了网易课堂的知了Flaskk. 十分感谢. └—01-Flask视图和URL ├—课时001.[Flask预热]课程介绍 ├—课时002.[Flask预热]Flask课程准备工作 ├—课时00 ...

  9. Django---手动编写视图

    手动编写视图 一. Request----->URL---->业务处理(Views)(Http Response) Response-------> 二. VOE    Django ...

随机推荐

  1. [Hive - Tutorial] Type System 数据类型

    数据类型Type System Hive supports primitive and complex data types, as described below. See Hive Data Ty ...

  2. Directory.GetCurrentDirectory

    1.一个应用程序中,Directory.GetCurrentDirectory获得的当前工作目录是C:\Windows\System32,这是为什么呢?是如何设置的? 2.在WinXP下:System ...

  3. Navicat 远程连接SQL Server 2014 Express 报08001错误

    场景:Navicat 远程连接SQL Server 2014 Express 报08001错误,经查验防火墙端口1434,1433已经打开 过程:1. 一开始觉得是连接名称问题,使用IP地址或者主机名 ...

  4. KVM背靠Linux好乘凉

    虚拟化是走向云的第一步,同理,开源虚拟化是走向开源云的第一步.云计算所提供的产品与方案都是围绕着IT资源的新交付与消费模式.云的形式多样,私有云.公有云与混合云,无论哪种云都具有三个关键特征:虚拟化. ...

  5. Linux Oracle服务启动&停止脚本与开机自启动

    在CentOS 6.3下安装完Oracle 10g R2,重开机之后,你会发现Oracle没有自行启动,这是正常的,因为在Linux下安装Oracle的确不会自行启动,必须要自行设定相关参数,首先先介 ...

  6. 第二百四十二天 how can I 坚持

    今天... 貌似没啥啊. 第一天带帽子上班. 还有回来买了两个柚子吃了,有点上火啊. 还有今天雾霾爆表啊,pm2.5  600多啊. 还有看了部电影<蚁人>,挺好看.希望不会出二.三.四. ...

  7. Mysql常见报错解决方法

    一:登录报错 ERROR 1045 (28000): Access denied for user 'mysql'@'localhost' (using password: NO) mysql日志文件 ...

  8. UVa 1630 Folding (区间DP)

    题意:折叠一个字符串,使得其成为一个尽量短的字符串  例如AAAAAA变成6(A) 而且这个折叠是可以嵌套的,例如 NEEEEERYESYESYESNEEEEERYESYESYES 会变成 2(N5( ...

  9. 在数据库各种状态下查询DBID的五大类十种方法汇总

    关于DBID: DBID是DataBase IDentifier的缩写,意思就是数据库的唯一标识符. 这个DBID在数据文件头和控制文件都是存在的,可以用于标示数据文件的归属. 对于不同数据库来说,D ...

  10. javascript --学习this

    this 在一般的强类型语言中,this指向的是这个对象本身,可在javascript中 this的取值是执行上下文环境的一部分 其实这个this并不是很难立即,只要记住二点就可以了 那就是谁call ...