大数据开发工程师vx

是 否 +2 论坛币

k人 参与回答

经管之家送您一份

应届毕业生专属福利!

求职就业群

赵安豆老师微信：zhaoandou666

经管之家联合CDA

送您一个全额奖学金名额~ !

立即领取

感谢您参与论坛问题回答

经管之家送您两个论坛币！

+2 论坛币

## 大数据开发工程师

后台代码都是应用的

1 2 3 4 5 6 7 8

var data= { 'a': $('input[name="a"]').val(), 'b': $('input[name="b"]').val() } $.getJSON($SCRIPT_ROOT + '/_add_numbers',data, function(data) { $('#result').text(data.result); $('input[name=a]').focus().select(); });

后端pthon代码如下

?

1 2 3 4 5 6

# ajax，Get方式与js交互(非表单）采用了flask框架@app.route('/_add_numbers')def add_numbers():   """Add two numbers server side, ridiculous but well..."""   a = request.args.get('a', 0, type=int)   b = request.args.get('b', 0, type=int)   log.info(a)   log.info(b)  return jsonify(result=a + b)

2.【万能方式】运用jquery的ajax与后台交互，设置不同的参数，能够get也能够post

上面的例子用ajax方式，前端代码如下

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23

var data= {           'a': $('input[name="a"]').val(),           'b': $('input[name="b"]').val()         } {#        $.getJSON($SCRIPT_ROOT + '/_add_numbers',data, function(data) {#} {#          $('#result').text(data.result);#} {#          $('input[name=a]').focus().select();#} {#        });#}         $.ajax({           type: 'get',           url: $SCRIPT_ROOT + '/_add_numbers',           data: data,           contentType: 'application/json; charset=UTF-8',           dataType: 'json',           success: function(data) {             $('#result').text(data.result);             $('input[name=a]').focus().select();           },           error: function(xhr, type,xxx) {             alert('error ')           }         });

后台代码不便仍然是

?

1 2 3 4 5 6

# ajax，Get方式与js交互(非表单）@app.route('/_add_numbers')def add_numbers():   """Add two numbers server side, ridiculous but well..."""   a = request.args.get('a', 0, type=int)   b = request.args.get('b', 0, type=int)   log.info(a)   log.info(b)  return jsonify(result=a + b)

3.用ajax补充一个post方式的例子

前端js如下

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

function testmethod ()     {       alert('rabbit');       var data = {         "name": "test"       }       $.ajax({         type: 'POST',         url: '/login',         data:data,         contentType: 'application/json; charset=UTF-8',         dataType: 'json',         success: function(data) {           $('#result').text(data.username);         },         error: function(xhr, type) {           alert('error ')         }       });     }

后台代码如下：

?

1 2 3 4 5

# ajax ，post方式与js交互（表单提交） @app.route('/login',methods=['POST']) def login():   log.info('lalal')   return jsonify(username='xixi',pwd='123')

这样就很轻松的完成了前端与后台的交互

实质上，前端与后端交互都是经过json完成的

至于表单提交，就不需求写js了，在form表单里面有有一个submit类型按钮，点击时，会自动提交到后台对应的路由上停止处置。关于表单提交，后台能够用

?

1	s=request.form.get('username',None)

来捕捉前端网页的值。但是假如是非表单提交，则需求用js获取值后，经过data参数传入到后端才行。

实例扩展：

python运用flask与js停止前后台交互的例子

flask与js停止前后台交互代码如下,后台给前端发数据：

python局部：

?



链接：https://pan.baidu.com/s/1It6rkyGirjwJD4mYRwwogw
提取码：ey6b
--来自百度网盘超级会员V4的分享

扫码加我 拉你入群

请注明：姓名-公司-职位

以便审核进群资格，未注明则拒绝

分享0 收藏0 回帖

关键词：开发工程师 数据开发 工程师 大数据 Application