zoukankan      html  css  js  c++  java
  • 高德地图和echarts结合实现地图下钻(二)

    一、学习ajax发送异步请求

     1     $(function(){
     2         //请求参数
     3         var list = {};
     4         //
     5         $.ajax({
     6             //请求方式
     7             type : "POST",
     8             //请求的媒体类型
     9             contentType: "application/json;charset=UTF-8",
    10             //请求地址
    11             url : "http://127.0.0.1/admin/list/",
    12             //数据,json字符串
    13             data : JSON.stringify(list),
    14             //请求成功
    15             success : function(result) {
    16                 console.log(result);
    17             },
    18             //请求失败,包含具体的错误信息
    19             error : function(e){
    20                 console.log(e.status);
    21                 console.log(e.responseText);
    22             }
    23         });
    24     });

    $.ajax()

    该方法用于执行Ajax请求,常用于其他jQuery Ajax方法不能完成的请求,也许我们可以把它称为"jQuery中Ajax系列方法之母"。

    形式:$.ajax({name:val, name:val,...});
    可选字段:
    1)url:链接地址,字符串表示
    2)data:需发送到服务器的数据,GET与POST都可以,格式为{A: '...', B: '...'}
    3)type:"POST" 或 "GET",请求类型
    4)timeout:请求超时时间,单位为毫秒,数值表示
    5)cache:是否缓存请求结果,bool表示
    6)contentType:内容类型,默认为"application/x-www-form-urlencoded"
    7)dataType:服务器响应的数据类型,字符串表示;当填写为json时,回调函数中无需再对数据反序列化为json
    8)success:请求成功后,服务器回调的函数
    9)error:请求失败后,服务器回调的函数
    10)complete:请求完成后调用的函数,无论请求是成功还是失败,都会调用该函数;如果设置了success与error函数,则该函数在它们之后被调用
    11)async:是否异步处理,bool表示,默认为true;设置该值为false后,JS不会向下执行,而是原地等待服务器返回数据,并完成相应的回调函数后,再向下执行
    12)username:访问认证请求中携带的用户名,字符串表示
    13)password:返回认证请求中携带的密码,字符串表示

    解释一下data和dataType的区别:

    ajax本质上就是针对一个url发送一个请求之后,url所在的服务器和ajax的数据进行交互,

    那么data就是发送请求的时候ajax可以带着数据一起发送给服务器,dataType一般是不用写的,

    这是预先猜测或者解析服务器返回的数据类型,比如服务器返回了json类型的一组数据。

    数据格式

    浏览器与服务器之间传输数据所采用的格式,比较常见的有xml,html,text,json,jsonp等,目前json由于占用更小存储,

    且是JavaScript原生格式,因此很受欢迎。

    当确定数据传输采用json格式后,下面就需要考虑序列化问题了。

    网络中传输的都是文本字符串(其实是二进制比特流,这里方便理解),因此在向网络通道中写入数据时,

    都需要先序列化json对象为文本字符串。而从网络通道中读取数据时,都需要反序列化文本字符串为json对象。

    在Python中json.dumps用于序列化,json.loads用于反序列化。

    如果确定数据格式是json,JS也需对服务器返回的数据进行反序列化,即把json样式的字符串变成json对象。

    1 var json_str = '{"result": "hello, world!"}';
    2 var json_object = eval("(" + json_str + ")");  // 法一,使用eval函数,注意括号
    3 var json_object = jQuery.parseJSON(json_str);  // 法二,使用jQuery的parseJSON函数
    4  
    5 alert(json_object.result);                     // 反序列化成功,输出结果

    Json对象和Json字符串解释

    json对象可以通过javascript存取属性!json对象装成json字符串经常用于前后台传输数据!


    如果你在前台使用,那么Json对象可以通过xx.name来调用,如果是字符串,那么就是字符串了

    ajax中,我们自己拼接的是一个JSON对象,以为它是无数据类型的,所以JS根据其格式默认其实对象,

    你要是往后台发,要先把它转换成JSON字符。

    从ajax的服务器发过的,一定是字符串,你想要把它解析,很简单,把它先变成JSON对象才行。

    在数据传输过程中,json是以文本,即字符串的形式传递的,而JS操作的是JSON对象,所以,

    JSON对象和JSON字符串之间的相互转换是关键。例如:
    JSON字符串:
    var str1 = '{ "name": "cxh", "sex": "man" }'; 
    JSON对象:
    var str2 = { "name": "cxh", "sex": "man" };

    JSON字符串转换为JSON对象

    要使用上面的str1,必须使用下面的方法先转化为JSON对象:

    //由JSON字符串转换为JSON对象

    var obj = eval('(' + str + ')');

    或者

    var obj = str.parseJSON(); //由JSON字符串转换为JSON对象

    或者

    var obj = JSON.parse(str); //由JSON字符串转换为JSON对象

    然后,就可以这样读取:

    Alert(obj.name);

    Alert(obj.sex);

    特别注意:如果obj本来就是一个JSON对象,那么使用eval()函数转换后(哪怕是多次转换)还是JSON对象,

    但是使用parseJSON()函数处理后会有问题(抛出语法异常)。

    可以使用toJSONString()或者全局方法JSON.stringify()将JSON对象转化为JSON字符串。

    例如:

    var last=obj.toJSONString(); //将JSON对象转化为JSON字符

    或者

    var last=JSON.stringify(obj); //将JSON对象转化为JSON字符

    转载自:https://www.cnblogs.com/laopo/p/11241633.html

    原文链接:https://blog.csdn.net/jinixin/article/details/80042763

    Tomorrow the birds will singing.

  • 相关阅读:
    一个简单的CSS3+js 实现3D BOX
    jquery $.extend()扩展插件获取焦点或失去焦点事件
    菜单滑动
    全选反选
    纯css,编写菜单移入效果
    登录窗口抖动效果
    [WCF]WCF起航
    FastReport 数据过滤
    [Oracle]TRIGGER
    两种递归方法的比较
  • 原文地址:https://www.cnblogs.com/rainbow-1/p/14575118.html
Copyright © 2011-2022 走看看