ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

前端评论区jq自动获取QQ头像昵称

2022-01-19 19:59:21  阅读:190  来源: 互联网

标签:QQ function name jq 昵称 json result avatar


使用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。

JSON语法

基本规则

数据在名称/值对中:json数据是由键值对构成的,键用引号(单双都行)引起来,也可以不使用引号,值得取值类型如下:

数字(整数或浮点数)

字符串(在双引号中)

逻辑值(true或false)

数组(在方括号中),比如:{“persons”:[{},{}]}

对象(在花括号中),比如:{“address”:{“province”:“北京”,…}}

null

数据由逗号分隔:多个键值对由逗号分隔

花括号保存对象:使用{}定义json格式

方括号保存数组:[]

比如定义基本格式:


var person = {"name": "张三", age: 23, 'gender': true};
比如定义嵌套格式:

// {}中套[]var person = {    "hobbies": ["足球", "篮球", "乒乓球"]};
// []中套{}var persons = [    {"name": "张三", "age": 23, "gender": true},    {"name": "李四", "age": 24, "gender": true},    {"name": "王五", "age": 25, "gender": false}];

获取数据主要有三种方式:

  • json对象.键名

  • json对象[“键名”]

  • 数组对象[索引]

Event 函数绑定函数至
$(document).ready(function)将函数绑定到文档的就绪事件(当文档完成加载时)
$(selector).click(function)触发或将函数绑定到被选元素的点击事件
$(selector).focus(function)触发或将函数绑定到被选元素的获得焦点事件
$(selector).mouseover(function)触发或将函数绑定到被选元素的鼠标悬停事件

标签:QQ,function,name,jq,昵称,json,result,avatar
来源: https://blog.csdn.net/qq_45802080/article/details/122588553

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有