使用Ajax自动获取QQ头像昵称

使用Ajax自动获取QQ头像昵称

整个过程

QQ失去焦点 -> 取 #QQd的值 ->(url=“https://api.usuuu.com/qq/”+QQ,) 请求返回josn
->

$("#nickname").val(result["data"].name);
$("[name='avatar']").val(result["data"].avatar);
源码:
--------------------html------------------------------
 <input type="hidden" name="avatar" value="-1>
 <input id="QQ" type="text" name="qq"                placeholder="输入qq号自动获取昵称头像">
  <input id="nickname" type="text" name="nickname"       placeholder="昵称(必填)">

----------------------js---------------------------
//#QQ失去焦点  取 #QQ值  请求返回josn ->  name=avatar  #nickname
        // 失去焦点
    $('#QQ').blur(function() {
        var QQ = $("#QQ").val();
        $.ajax({
            url : "https://api.usuuu.com/qq/"+QQ,
            type: "GET",
            dataType: "json",
            success : function(result) {
                console.log(result["data"].name,result["data"].avatar);
                $("#nickname").val(result["data"].name);
                $("[name='avatar']").val(result["data"].avatar);
            }
        });
    });

知识点:

1.JSON数据
JSON(JavaScript Object Notation, JS 对象简谱)

是一种轻量级的数据交换格式,比xml更轻巧(由于 JSON 所使用的字符要比 XML 少得多,可以大大得节约传输数据所占用的带宽)。

json是javascript原生格式,就是说在javascript中处理json数据,需要引用其他API或工具包。

简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。

只需要记住!
Json是一种文本字符串!被存储在responseText属性中,而读取json数据可以使用javascript的eval函数来解析json。