flask中使用ajax 处理前端GET请求 弹框展示

之前写过一篇 处理post请求,今天遇到get的,有些参数处理不一样

post请求的地址:

https://www.cnblogs.com/whycai/p/10914349.html

 

get效果:

不一样的地方:

一、js中改成 get,数据处理不一样

 

二、后端拿到前端传的值不一样

form.get 改成 args.get

methods 换成 GET

 

完整的如下:

 

1.html(不变)

 1 <html>
 2 <head></head>
 3 <body>
 4 <form class="formXXX1" >
 5 <br class="formXXX2" />
 6 <div class="form-group">
 7 <label for="
 8 telephone14">手机号: <input class="form1" type="iphone" id="a" name="a" maxlength="11" placeholder="请输入11位合法手机号" /> </label>
 9 </div>
10 <div class="example-box">
11 <label>&nbsp;环境:</label>
12 <label class="radio"> <input type="radio" id="b" name="b" value="0" checked="" /><span>b1</span> </label>
13 <label class="radio"> <input type="radio" id="b" name="b" value="1" /><span>b2</span> </label>
14 </div>
15 <br />
16 <div class="form-group">
17 <button class="btn btn-primary" type="button" id="notify">提交</button>
18 </div>
19 </form>
20 </body>
21 </html>

 

2.js

 1 //js文件根据实际路径填写
 2 <script type="text/javascript" src="static/js/jquery.min.js"></script>
 3 
 4 <script type = "text/javascript" >
 5 $('#notify').on('click',
 6 function() {
 7 //取变量
 8 var b= $("input[name='b']:checked").val(); //单选框取值
 9 var a= $('#a').val();
10 
11 
12 //小于11位提示
13 if (a.length != 11) {
14 alert('手机号小于11位,请重新输入');
15 return;
16 }
17 
18  //ajax 提交数据
19 
20 $.ajax({
21 type: "GET",
22 dataType: "json",
23 url: "/aaa",//后端请求
24 data: {a:a,b:b},
25 success: function(result) {
26 console.log(result);
27 {
28 alert('3333' + result);
29 }
30 },
31 error: function (result) {
32 console.log(result);
33 {
34 alert(result);
35 }
36 }
37 });
38 
39 })
40 
41 </script>

 

python:

1 @app.route('/aaa',methods=['GET'])
2 def aaa():
3     a = request.args.get('a')
4     b = request.args.get('b')
5     print (a,b)
6     # msg = bbb(a, b)#调用 bbb方法拿返回值
7     msg =a,b
8     return jsonify(msg)
posted @ 2019-12-28 15:59  菜小鱼~  阅读(1104)  评论(0编辑  收藏  举报