json操作容易出现的细微问题

通过Goggle提供的Gson（把普通数据变成json数据的jar包）可以处理json数据。

什么是json数据？

boook{ id=1,name='小李' }

在前后端操作中，经常需要把后端数据转成json类型数据然后再提供给前端使用。

总结一下：

前端使用时：

这是一个分页方法，我们通过ajax发送请求到服务端，服务端返回一个分页后的json数据，

我们解析json的时候，通过自己拼接字符串，把数据显示出来，就像下面的代码：

　这是正常的代码

table+="<input type='button' value='上一页' class='bt' pageNum='"+pageInfo.prePage+"'pageSize='"+pageInfo.pageSize+"' />";

如果是下面这样：在'pageSize前面加个空格（最开始的目的是为了让代码更整洁一点）

table+="<input type='button' value='上一页' class='bt' pageNum='"+pageInfo.prePage+" 'pageSize='"+pageInfo.pageSize+"' />";

这样让pageNum的值多了空格，如果这个值传递到服务端会产生异常，或者数据不准确。

function loadUser(pageNum,pageSize){
        $.ajax({
            method:"get",
            url:"/index?pageNum="+pageNum+"&pageSize="+pageSize,
            dataType:"json"
        }).done(function (pageInfo) {
            var table = "<div id='div2'><table >";
            pageInfo.list.forEach(function (user) {
                table+="<tr>";
                table+="<td>"+user.id+"</td>";
                table+="<td>"+user.sysUsername+"</td>";
                table+="</tr>";
            })
            table+="</table><br>";
            table+="<input type='button' value='首页' class='bt' pageNum='1'pageSize='"+pageInfo.pageSize+"' />";
            table+="<input type='button' value='上一页' class='bt' pageNum='"+pageInfo.prePage+"'pageSize='"+pageInfo.pageSize+"' />";
            table+="<input type='button' value='下页' class='bt' pageNum='"+pageInfo.nextPage+"'pageSize='"+pageInfo.pageSize+"' />";
            table+="<input type='button' value='尾页' class='bt' pageNum='"+pageInfo.navigateLastPage+"'pageSize='"+pageInfo.pageSize+"' />";
            table+="</div>"
            $("#div2").remove();
            $("#div1").html(table);
            $(".bt").on('click',function () {
                //prop只能获取标签的固有属性
                //attr可以获取自定义属性
                loadUser($(this).attr("pageNum"),$(this).attr("pageSize"));
            })
        })
    }