Ajax前后端交互——后端接收前端页面变量
核心代码：
- app.py
from flask import Flask, render_template, request, jsonify
app = Flask(__name__)
@app.route('/')
def index():
return render_template("index.html")
#接受前台消息
@app.route('/receive_message', methods=['GET'])
def send_message():
global message_get #定义全局对象（全局变量）
message_get = "" #初始化全局对象
message_get = request.args['message'] #接受前台变量
print("收到前端页面变量值：",message_get)
# print("收到前端发过来的信息：%s" % message_get)
return "数据传递成功！"
if __name__ == '__main__':
app.run()
- index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<label for="send_content">向后台发送消息：</label>
<input id="send_content" type="text" name="send_content">
<input id="send" type="button" value="发送">
</div> <script src="/static/js/jquery-3.6.0.min.js"></script> <!-- 发送 -->
<script type="text/javascript">
$("#send").click(function () {
var message = $("#send_content").val()
$.ajax({
url:"http://127.0.0.1:5000/receive_message",
type:"GET",
data:{
message:message
},
success:function (data) {
alert(data)
},
error:function () {
alert("接收失败")
}
})
})
</script> </body>
</html>
效果截图：
Ajax前后端交互——后端接收前端页面变量的更多相关文章
- THINKPHP_(7)_THINKPHP6的controller模型接收前端页面通过ajax返回的数据，会因为一个div而失败
这个随笔比较短. 同样的前端页面代码,修改了一下,后端模型接收不到数据. 利用beyond compare软件比对两个前端文件, 发现多了一个</div>标签. 多了一个</div& ...
- 前后台交互（打开前端页面，不传递任何数据，发送ajax请求）
1.打开前端,不传递任何数据 <script src="./jquery.min.js"></script> <script> $(docume ...
- bootshiro---开源的后台管理框架--基于springboot2+ shiro+jwt的真正rest api资源无状态认证权限管理框架,开发人员无需关注权限问题,后端开发完api,前端页面配置即可
https://gitee.com/tomsun28/bootshiro
- 一、Django前后端交互之Ajax和跨域问题
一.Ajax介绍 1.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术.AJAX(Asynchronous Javascript And XML)翻译成中文就是“异步Jav ...
- ajax学习----json，前后端交互，ajax
json <script> var obj = {"name": "xiaopo","age": 18,"gender ...
- 把数据转化为JSON格式用ajax进行前后端交互
接着在https://www.cnblogs.com/dong973711/p/10907733.html的基础上做验证. 从前端提交数据 前端页面,submit.html <!DOCTYPE ...
- SSM-网站后台管理系统制作（4）---Ajax前后端交互
前提:Ajax本身就为前后端交互服务的,实现功能:用户输入信息,实时判断用户的情况,这也是现在登录界面普遍流行的做法.前端js通过注释识别Controller层,该层查询返回,和之前Google验证码 ...
- thinkphp+jquery+ajax前后端交互注册验证
thinkphp+jquery+ajax前后端交互注册验证,界面如下 register.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- 前端ajax的各种与后端交互的姿势
前端中常常用的与后端交换数据的话,通常是要用到ajax这种方法的 但是交互的方式有很多种,很多取决于你后端的属性,我这儿主要列举我目前项目比较常用的两种方式 --一个是我们通用的web api和控制器 ...
随机推荐
- leetcode921. 使括号有效的最少添加
题目描述: 给定一个由 '(' 和 ')' 括号组成的字符串 S,我们需要添加最少的括号( '(' 或是 ')',可以在任何位置),以使得到的括号字符串有效. 从形式上讲,只有满足下面几点之一,括号字 ...
- JavaScript 遍历对象、数组总结
在日常工作过程中,我们对于javaScript遍历对象.数组的操作是十分的频繁的,今天抽空把经常用到的方法小结一下,方便今后参考使用! javaScript遍历对象总结 1.使用Objec ...
- java中Object类是怎么回事，干嘛使的？举例说明！
Object类的作用:m a r k - t o- w i n: 在java中,因为所有的类都有共性,所以java的缔造者们把java设计成这样:所有的类都是Object类的直接或间接子 ...
- 理解Android Framework
一 . Android 系统架构 Android是一个包括操作系统,中间件和关键应用的移动设备软件堆: 作为一个开源的软件,android包含了众多的功能和庞大的代码,他的代码基于linux. 1. ...
- Android Studio项目导入方法+问题+解决办法
我从一个大神的GitHub那下载了一个安全卫士软件 https://github.com/kotlindev/MobileSafe 1.下载到自己Android的项目文件夹,解压. 2.用AS打开这个 ...
- springboot插件
目前spring官网(http://spring.io/tools/sts/all)上可下载的spring插件只有:springsource-tool-suite-3.8.4(sts-3.8.4).但 ...
- IDEA中 mybatis-config、applicationContext.xml、log4j.properties、SpringMVC等文件没有图标标识符号，不是一个xml文件
1. 举例说明 mybatis-config.xml文件不显示图标,识别不出该xml文件 2. 解决办法 1)先点击 File -> Settings-,然后贴入下面代码 (2) 具体操作如下图 ...
- Spring-aop注解开发（切点表达式的抽取）
接上一篇aop注解快速开发 @Component @Aspect //标注当前aspect是切面类 public class MyAspect { @Before("Pointcut()&q ...
- Java学习day6
今天跟着教学视频做了个简易的学生管理系统 在编写完全部代码之后出现了在空白处右键没有run as选项的问题,通过csdn与博客园上的多个帖子介绍,得知是jdk配置不对,正确配置后问题得到解决 明天学习 ...
- 记录Neo4j上写的简单cypher语法
neo4j是一个高性能的图形数据库,既然是数据库,那么主要操作就是增.删.改.查.所以进入正题: 一.CREATE:创建 语法如下: 1.create(变量名:标签名) :建立一个标签为Animal的 ...