使用见 Flask(python)异步 (Ajax) 返回 JSON 格式数据
1.$.getJSON
$.getJSON()是专门为 Ajax 获取 JSON 数据而设置的, 并且支持跨域调用, 其语法的格式为:
getJSON(url,[data],[callback])
url:string 类型, 发送请求地址
data : 可选参数, 待发送 Key/value 参数 , 同 get,post 类型的 data
callback : 可选参数, 载入成功时回调函数, 同 get,post 类型的 callback
- $.getJSON("{{ url_for('form_data') }}",params, function (result) {
- $("#myDiv").append("hello world1");
- console.log(obj.username + "<br>");
- });
- 2.$.Ajax
$.Ajax 是 jQuery 底层 Ajax 实现,$.Ajax 是一种通用的底层封装,$.Ajax()请求数据之后, 则需要使用回调函数, 有 beforeSend,error,dataFilter,success,complete 等.
格式:
- $.Ajax({
- url:"路径",
- type:"post/get",
- datatype:"json",
- // 成功的回调函数
- success:function(data){
- alert("回调函数成功了");
- },
- // 失败的回调函数
- error:function(){
- alert("服务器请求失败");
- },
- // 发送请求前调用, 可以放一些 "正在加载" 之类的话
- beforeSend:function(){
- alert("正在加载");
- }
- });
例如:
- $.Ajax({
- "url": "{{ url_for('form_data') }}",
- "type": "POST",
- "data": params,
- "success": function (obj) {
- $("#myDiv").append("hello world")
- console.log(obj.username + "<br>")
- },
- "error": function (obj) {
- console.log(obj)
- },
- "dataType": "json",
- "async": true
- });
- 3.$.get
$.get 是简单易用的高层实现, 我们使用 $.get 方法, jQuery 会自动封装调用底层的 $.Ajax.
$.get 只处理简单的 GET 请求功能以取代复杂 $.Ajax, 请求成功时可调用回调函数. 不支持出错时执行函数, 否则必须使用 $.Ajax.
$.get( url ,[data] ,[callback] )
url:string 类型, Ajax 请求的地址.
data: 可选参数, object 类型, 发送至服务器的 key/value 数据会作为 QueryString 附加到请求 URL 中.
callback: 可选参数, function 类型, 当 Ajax 返回成功时自动调用该函数.
例如:
- $.get("{{ url_for('form_data') }}", params, function (obj) {
- $("#myDiv").append("hello world")
- console.log(obj.username + "<br>");
- }, "json");
- 4.$.post
$.post 是简单易用的高层实现, 我们使用 $.post 方法, jQuery 会自动封装调用底层的 $.Ajax.
$.post 只处理 post 请求功能以取代复杂 $.Ajax . 请求成功时可调用回调函数. 不支持出错时执行函数, 否则必须使用 $.Ajax.
$.post(url,[data],[callback],[type])
这个方法和 $.get()用法差不多, 唯独多了一个 type 参数, 那么这里就只介绍 type 参数吧, 其他的参考上面 $.get()的.
type:type 为请求的数据类型, 可以是 html,xml,JSON 等类型, 如果我们设置这个参数为: JSON, 那么返回的格式则是 JSON 格式的, 如果没有设置, 就和. get()返回的格式一样, 都是字符串的.
例如:
- $.post("{{ url_for('form_data') }}", params, function (obj) {
- $("#myDiv").append(obj.username + "<br>")
- console.log(obj);
- }, "json");
来源: http://www.bubuko.com/infodetail-3038833.html