通过上一篇文章的快速入门,实现了Python利用Flask框架搭建web项目的基本内容,本文将进一步介绍如何通过jQuery实现Flask项目的异步刷新,以达到局部更新的目的,仅供学习分享使用,如有不足之处,还请指正。
什么是Ajax?
Ajax是Asynchronous JavaScript and Xml的简称,通过Ajax向服务器发送请求,接收服务器返回的json数据,然后使用javascript修改页面来实现页面数据的局部刷新。AJAX 是与服务器交换数据的艺术,它在不重载全部页面的情况下,实现了对部分网页的更新。使用jQuery框架可方便的编写ajax代码,需要jQuery.js文件。
jQuery下载
jQuery可以通过官网进行下载,在开发过程中,为便于调试,可下载开发版。如下所示:
创建模板
在下载完jQuery后,将其拷贝到static/js目录下,然后创建模板文件ajax.html,如下所示:
ajax.html文件中调用jQuery创建ajax,然后更新页面,如下所示:
1 <!DOCTYPE html> 2 <html lang="en" 3 head 4 meta charset="UTF-8" 5 title>异步刷新页面</ 6 script src="../static/js/jquery-3.6.0.js"></script 7 type="text/javascript" 8 $(document).ready(function () { 9 $("#btn_ajax).click(10 $.ajax({ 11 url: /ajax_data,12 type: post13 data: {name: 李四score99},1)">14 success: (data) { 15 $(h1).html(中国加油>>" + data); 16 },1)">17 error: 18 alert(发送ajax失败!); 19 } 20 21 }) 22 }); 23 }); 24 25 26 body27 h1>局部刷新28 input id="btn_ajax" type="button" value="点我有惊喜"/> 29 30 html>
其中ajax_data为指定路由,主要用于获取数据,如下所示:
注意:一般默认情况下,flask路由只支持get方式,为支持post方式,需要显示声明。
启动服务
启动flask服务,在浏览器中进行访问,初始化加载时如下所示:
点击按钮后,通过ajax调用后端服务,成功后,刷新页面,实现局部刷新功能,如下所示:
以上就是Python利用flask及jQuery实现异步刷新的方法,旨在抛砖引玉,分析分享。
字符串格式化
字符串的格式化方法分为两种,分别为占位符(%)和format方式。占位符方式在Python2.x中用的比较广泛,随着Python3.x的使用越来越广,format方式使用的更加广泛。
占位符(%)方式
1 name = '小王' 2 age = 20 3 score = 100 4 country = 中国5 print("我的名字叫%s我的年龄是%d我的分数是%d我的祖国是%s" % (name,age,score,country))
占位符还可以通过字典的方式进行匹配,如下所示:
1 我的名字叫%(name)s我的年龄是%(age)d我的分数是%(score)d我的祖国是%(country)s" % ( 2 {name": name,age": age,1)">score": score,1)">country": country}))
输出结果如下所示:
format方式
我的名字叫{}我的年龄是{}我的分数是{}我的祖国是{}".format(name,country)) # 默认1对1,多1不可,缺1不可 6 我的名字叫{0}我的年龄是{1}我的分数是{2}我的祖国是{3} 通过位置找出替换目标及插入的参数 7 我的名字叫{name}我的年龄是{age}我的分数是{score}我的祖国是{country}".format(name=name,age=age,score=score,1)">8 country=country)) {}通过关键字找出替换目标及插入的参数
以上几种format方式,输出结果一致,如下所示:
插值法
在Python 3.6以后,还提供了插值法,实现格式化,如下所示:
print(f")
输出结果也是一样的,如下所示:
备注
长相思·其一
长相思,在长安。
络纬秋啼金井阑,微霜凄凄簟色寒。孤灯不明思欲绝,卷帷望月空长叹。美人如花隔云端!
上有青冥之长天,下有渌水之波澜。天长路远魂飞苦,梦魂不到关山难。
长相思,摧心肝!
原文地址:https://www.cnblogs.com/hsiang
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。