一、描述
在论坛的版块页面上有一个收藏本版的超链接,点击该超链接即可收藏该版块,但是为了防止重复收藏,以及未登录就收藏的错误操作,我们采用Ajax异步返回收藏提示信息。
二、实现细节
1、在jsp页面中点击收藏超链接,执行其onclick事件中的方法,而不是跳转到某个新的页面。
2、在boardCollect.js文件中采用Ajax技术,执行后台的收藏版块的操作,并且异步写回提示信息。
三、源代码
1、boardCollect.js
// 创建请求 var http_request; function createXMLHttpRequest(){ http_request=false; if(window.XMLHttpRequest){ http_request=new XMLHttpRequest(); //初始化http_request if(http_request.overrideMimeType){ http_request.overrideMimeType(text/html); } }else if(window.ActiveXObject){ try{ http_request=new ActiveXObject(Msxml2.XMLHTTP); //在IE中创建XMLHttpRequest对象,新版IE }catch(e){ try{ http_request=new ActiveXObject(Microsoft.XMLHTTP); //在IE中创建XMLHttpRequest对象旧版IE }catch(e){} } } if(!http_request){ window.alert(不能创建XMLHttpRequest对象实例); return false; } } function boardCollect(id){ showCollects(boardCollect.action?boardId=+id); } function showCollects(url){ //调用createXMLHttpRequest创建http_request createXMLHttpRequest(); //onreadystatechange状态发生变化,返回processRequest方法进行处理 http_request.onreadystatechange=processRequest; http_request.open(GET,url,true); http_request.send(null); } // 处理返回信息的函数 function processRequest(){ if(http_request.readyState==4){ if(http_request.status==200){ //正常返回,获取返回的responseText数据 var com = eval('('+http_request.responseText+')'); var Feedback = com.Feedback; if(Feedback==true){ //收藏成功 document.getElementById(ntcwin).style.display=block; function remove(){ document.getElementById(ntcwin).style.display=none; } //显示1.5秒后消失 setInterval(remove,1500); }else if(Feedback==already collect){ //已经收藏,不能重复收藏,将页面上提示重复收藏的div显示出来 document.getElementById(fwin_a_favorite).style.display=block; }else{ //未登录就收藏,修改页面上errorInfo显示的提示的错误信息 document.getElementById(errorInfo).innerHTML=抱歉,您还未登录没有此权限,请登录后重试; document.getElementById(fwin_a_favorite).style.display=block; } } } } //隐藏tcl对应的div function hideWindow(tcl){ document.getElementById(tcl).style.display=none;
2、board.jsp(有些css代码没有上传,也许会出现显示格式问题)
<%@ page language=java pageEncoding=UTF-8%> <%@ taglib uri=/struts-tags prefix=s%> <%@ taglib uri=http://java.sun.com/jsp/jstl/core prefix=c%> <%@ taglib uri=http://java.sun.com/jsp/jstl/fmt prefix=fmt%> <% String path = request.getContextPath(); String basePath = request.getScheme()+://+request.getServerName()+:+request.getServerPort()+path+/; %>
3、后台处理收藏版块的java源代码
/** *收藏版块 */ public String boardCollect(){ System.out.println(enter boardCollect try boardId=+boardId); try { HttpServletResponse response; response=ServletActionContext.getResponse(); response.setContentType( text/json;charset=utf-8); response.setHeader( Cache-Control,no-cache); response.setHeader( Pargma,no-cache); PrintWriter out; out = response.getWriter(); //mcpForumPost = mcpForumPostDAO.findById(postId); JSONObject js = new JSONObject(); ScpnUser u=(ScpnUser)this.getSession().get(user); if(u!=null){ //判断该用户是否已经收藏该版块 String exitBoardCollect = SELECT COUNT(*) FROM mcp_forum_board_collect where user_id= +u.getUserId()+ and board_id=+boardId; System.out.println(exitBoardCollect:+exitBoardCollect); Integer count=jdbcTemplate.queryForInt(exitBoardCollect); if(count>0){ js.put(Feedback,already collect); }else{ Timestamp currentTime = new Timestamp(System.currentTimeMillis()); SimpleDateFormat sdf = new SimpleDateFormat(yyyy-MM-dd HH:mm:ss); String time = sdf.format(currentTime); //将收藏记录插入版块收藏表 String insertBoardCollect = INSERT INTO mcp_forum_board_collect(board_id,user_id,board_collect_time) VALUES (+boardId+,+u.getUserId()+,'+time+'); System.out.println(insertPostCollect:+insertBoardCollect); jdbcTemplate.update(insertBoardCollect); //更新版块收藏数量 String updateColNum = UPDATE mcp_forum_board SET board_collectNum=1 where board_id=+boardId; System.out.println(updateColNum:+updateColNum); jdbcTemplate.update(updateColNum); userLogger.insert(UserLogger.UPDATE,u.getAccount()+收藏版块); js.put(Feedback,true); } }else { js.put(Feedback,not login); } out.write(js.toString()); out.close(); } catch (IOException e) { e.printStackTrace(); } catch (JSONException e) { e.printStackTrace(); } return null; }