这篇短文使用jquery。
Flask提供一个很简单的方法来处理Ajax请求——在视图函数中用request的属性is_xhr来判断,如果是true则是异步请求。
Jquery的$.getJSON()方法会主动向服务端发出ajax请求(不知这个理解是否正确?),服务端响应后调用$.getJSON的回调函数。在回调函数中就可以操作Html页面上的元素了。
客户端:ajax.html
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"/> <title>Document</title> <link href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> </head> <body> <h1>Ajax</h1> <div id="test">Show data count:</div> <script src="//cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> <script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <script> $(document).ready(function(){ $.getJSON(‘/ajax‘,function(data){ $(‘#test‘).append(‘<span class="badge">‘+data.count+‘</span>‘); }); }); </script> </body> </html>
服务端:
@app.route(‘/ajax‘) def y(): if request.is_xhr: y = Area.query.all() return jsonify({‘count‘:len(y)}) return render_template(‘ajax.html‘)
--End--
时间: 2024-10-11 07:23:36