【Bug向】jQuery+Ajax+JSON 实现点赞功能

思路：很基本的点赞功能，利用jQuery实现js代码，绑定点击事件使能够改变图标文字的颜色；利用jQuery封装的Ajax请求，能够做到更新部分网页而不刷新整个页面，增强用户体验，编写了servlet实现点赞或取消的逻辑，设置服务器返回的响应数据为JSON格式

目录

• • • 1、阿里iconfont图标，用symbol格式引用，无法改变颜色
    • 2、颜色格式
    • 3、接收JSON格式的响应数据，取value结果为undefined

1、阿里iconfont图标，用symbol格式引用，无法改变颜色

用的是参考链接的第一种方法。先改为 fill="#…"，之后才可以修改颜色（直接像设置字体颜色一样设置color属性）

参考：阿里iconfont图标不能修改颜色的解决方案

2、颜色格式

写好了jQuery代码，运行时发现颜色只在第一次点击时改变了，也就是说一直在执行 else 下的语句（当颜色为点赞后的彩色），判断流程没奏效，

控制台打印发现是，只好把判断条件改为 color == "rgb(255, 193, 82)"，再次点击可以改变颜色了。

3、接收JSON格式的响应数据，取value结果为undefined

1. 设置ajax请求的 data_type 属性值为 "JSON"
2. 接收服务器返回的响应数据， success: function (result) { }
3. JSON格式获取数据，直接 result.sum

但按 3. 进行获取的JSON对象value值，在控制台打印为undefined，只有通过JS的 eval() 函数二次加工才获得到。原因待找寻……

参考：Jquery ajax方法解析返回的json数据读取undefined的解决办法

【tips】复习jquery

1. 事件：

• .click(func () { })，绑定点击事件
• .hover(func1 () {}, func2() {})，绑定鼠标移入移出的事件，相当于 .mouseover(func1 () {}).mouseout(func2() {})

2. css属性：

• $(this).css(“color”)，获取属性的值
• $(this).css(“color”, “#808080”)，改变属性值