ajax实现异步刷新

Posted 2020-11-16 lcsin

1. 导入 json 包：

jackson-annotations-2.8.9.jar
jackson-core-2.8.9.jar
jackson-databind-2.8.9.jar
json.jar

2. js 代码

$.ajax({
        url: "url",
        type: "post/get",
        data: {
            key1:val1,
            key2:val2,
        },
        dateType:‘json‘,
        success: function(data){
            /*将旧列表内容移除*/
            $("#comment_list li").remove(); 
            if( data!=null ){                    
                                        
                for(var i=0;i<data[‘comment‘].length;i++){
                     /*循环更新列表内容*/
                    $("#comment_list").append(
                            "<li class=‘comment-content‘> " +
                                "<span class=‘comment-f‘> #" + (data[‘comment‘].length-i) + "</span>" +
                                "<div class=‘comment-main‘ " +
                                    "<p>" + 
                                        "<a class=‘address‘> " + data[‘comment‘][i][‘acount‘] + "</a>" +
                                        "<span class=‘time‘ > " + data[‘comment‘][i][‘time‘] + "</span>" + "<br>" + data[‘comment‘][i][‘content‘] +
                                    "</p>" +
                                "</div>" +
                            "</lic>"
                    )
                }    
                document.getElementById("comment-textarea").value = "";
            }
                
        }
            
    })

3. controller 代码

@RequestMapping(value="/url")
@ResponseBody
public Map<String, Object> commentAdd(String acount,Integer articleId,String content,String time,Integer editor){
        
　　Map<String,Object> map = new HashMap<String, Object>();
   List<Comment> comments = null;
        
   time = new TimeFormat().timeFormat(new Date());
        
   int r = commentService.commentAdd(acount, articleId, content, time,null);
        
   if(r != 0 ){
   　　comments = commentService.getCommentsByArticleId(articleId,null);
       map.put("comment", comments);
   }
        
　　System.out.println("==>"+acount+articleId+content+time);
    
   return map;
}