菜小鱼初次使用 ajax,想前端提交数据,后端处理后,将结果以弹框的形式展示,在网上查看了好多,不停的调试,终于调通了

html:

 <html>
<head></head>
<body>
<form class="formXXX1" method="post">
<br class="formXXX2" />
<div class="form-group">
<label for="
telephone14">手机号: <input class="form1" type="iphone" id="a" name="a" maxlength="11" placeholder="请输入11位合法手机号" /> </label>
</div>
<div class="example-box">
<label>&nbsp;环境:</label>
<label class="radio"> <input type="radio" id="b" name="b" value="0" checked="" /><span>b1</span> </label>
<label class="radio"> <input type="radio" id="b" name="b" value="1" /><span>b2</span> </label>
</div>
<br />
<div class="form-group">
<button class="btn btn-primary" type="button" id="notify">提交</button>
</div>
</form>
</body>
</html>

js:

 //路径根据实际路径填写
<script type="text/javascript" src="static/js/jquery.min.js"></script> <script type = "text/javascript" >
$('#notify').on('click',
function() {
//取变量
var b= $("input[name='b']:checked").val(); //单选框取值
var a= $('#a').val();
var data = {
data: JSON.stringify({
'a': a,
'b': b
}),
} //小于11位提示
if (a.length != 11) {
alert('手机号小于11位,请重新输入');
return;
} //ajax 提交数据 $.ajax({
type: "POST",
dataType: "json",
url: "/aaa",//后端请求
data: data,
success: function(result) {
console.log(result);
{
alert('3333' + result);
}
},
error: function (result) {
console.log(result);
{
alert(result);
}
}
}); }) </script>

flask:

 @app.route('/aaa',methods=['POST'])
def aaa():
data = json.loads(request.form.get('data'))
a= data['a']
b= data['b']
print (a,b)
# msg = bbb(a, b)#调用 bbb方法拿返回值
msg =a,b
return jsonify(msg)

图例:

参考:博文https://www.cnblogs.com/wanghaonull/p/6340491.html

flask中使用ajax 处理前端请求 弹框展示的更多相关文章

  1. flask中使用ajax 处理前端请求,结果展示在同一页面,不点击页面不展示

    在同一页面点击按钮,后端处理后展示在同一页面,不点击隐藏该结果:与上一篇大同小异,需要在 html.flask.js微调 效果展示: (未点击查询) (点击查询) html: <html> ...

  2. flask中使用ajax 处理前端请求,每隔一段时间请求不通的接口,结果展示同一页面

    需求: flask中使用ajax 处理前端请求,每隔一段时间请求不通的接口,结果展示同一页面 用到 setTimeout方法,setTimeout(function(){},1000):setTime ...

  3. flask中使用ajax 处理前端请求,每隔一段时间请求一次

    需求: flask中使用ajax 处理前端请求,每隔一段时间请求一次,并展示在页面 使用 setInterval(function(){},1000)方法 结果展示: html:(test.html) ...

  4. Android填坑系列:在小米系列等机型上放开定位权限后的定位请求弹框

    背景: 近期因实际项目需要,在特定操作下触发定位请求,取到用户位置及附近位置. 问题: 经初步选型,最终决定接入百度定位,按照百度定位SDK Android文档,接入过程相对顺利.但随后发现,在小米系 ...

  5. Three.js中的div标签跟随(模型弹框)

    目录 Three.js中的div标签跟随(模型弹框) 参考官方案例 核心渲染器 用法 注意事项 Three.js中的div标签跟随(模型弹框) 参考官方案例 核心渲染器 three.js-master ...

  6. 3.0+百度地图在地图初始化的时候就弹框展示一个信息框,而不是用户点击poi时才弹出

    有些时候我们会有这样的业务:当用户根据地址跳转到地图后,希望能够立即弹框展示该poi的地址信息. 实现方法: 百度地图3.0+的类BaiduMap中提供了一个方法showInfoWindow(Info ...

  7. Laravel中的ajax跨域请求

    最近接触Laravel框架ajax跨域请求的过程中遇到一些问题,在这里做下总结. 一开始发起ajax请求一直报500错误,搜索相关资料后发现Laravel要允许跨域请求可以加入Cors中间件,代码如下 ...

  8. Asp.Net Mvc4 Ajax提交数据成功弹框后跳转页面

    1.cshtml页面代码 @model Model.UserInfo @{     ViewBag.Title = "Edit"; var options = new AjaxOp ...

  9. django_jquery中使用ajax发送post请求变成get请求

    今天在进行js开发的过程中出现了一个奇怪的问题,就是使用ajax向后端发送post请求时,在浏览器network中查看response时,显示400 bad request 并且请求方式变成get,因 ...

随机推荐

  1. Ubuntu18.04 root 登录

    默认安装Ubuntu18.04都是不允许以root用户进行登录的,想要以root用户进行登录需要进行一些操作,主要是以下几个步骤:第一步:以普通用户登录系统,创建root用户的密码在终端输入命令:su ...

  2. PHP正则匹配价格

    /** * 匹配价格 * @param $price * @return bool */ public static function checkPrice($price) { // 不能小于0 if ...

  3. PHP如何访问数据库集群

    一般常见的有三种做法, 1,自动判断sql是否为读,来选择数据库的连接: 实例化php DB类的时候,需要一次连接两台服务器,然后根据slq选择不同的连接,举个例子: $link_w = mysql_ ...

  4. JAVA httpURLConnection curl

    // 文件路径 D:\ApacheServer\web_java\HelloWorld\src\com\test\TestHttpCurl.java package com.test; import ...

  5. 阿里云服务器安装mysql8遇到的问题

    1.提供一个离线mysql下载路径:http://mirrors.163.com/mysql/Downloads/MySQL-8.0/ 2.在线mysql8安装: 2.1 下载mysql: wget ...

  6. ORAchk - 数据库配置检查工具

    1.概要2.下载和安装3.如何执行4.执行过程5.报告6.参考 1.概要 ORAchk之前被称为RACcheck,后来它的检查范围进行了扩展,改名为了ORAchk,它是在数据库系统进行健康检查的一个专 ...

  7. Acuntetix的安装与使用

    1.下载软件压缩包文件,首先点击"Acunetix.Web.12.0.180911134.Retail.exe"安装最新版原程序 2.阅读并同意软件安装协议 3.设置登录信息,包括 ...

  8. hadoop 完全分布式搭建总结

    完全分布式--------------- 1.配置文件 [core-site.xml] hdfs 地址 fs.defaultFS=hdfs://s129:8020/ [hdfs-site.xml] 副 ...

  9. poj 3252 数位dp

    题意:一个二进制的数,如果0的个数大于1的个数,那么我们称这个数为Round Numbers,求给定区间(十进制表示)中Round Numbers的个数 题解:数位dp,不过这里枚举的时候lead标记 ...

  10. jquery.fileupload源码解读笔记

    基础编程风格 新建 test.html  和 test.js和 main.js和 无论哪种顺序 <body> <script src="/Sandeep/js/jquery ...