最近沒有更新部落格,專案中用到一個客服聊天並顯示是否線上的小功能,記錄一下:

要想可以查詢qq的線上狀態和發起及時聊天(參考上上篇部落格),必須去此網址開通qq推廣(http://shang.qq.com/v3/widget.html)

http://webpresence.qq.com/getonline?Type=1&123456:1111:

java程式碼

StringBuffer sb = new StringBuffer();
			sb.append("http://webpresence.qq.com/getonline?Type=1&");
			for (CustomerServiceDTO customerServiceDTO : customerList) {
				sb.append(customerServiceDTO.getCustomerServiceQQ()+":");
			}
			model.addAttribute("qqList", sb);
 

<!--客服-->
<div class="kefu_wrap">
	<img class="kefu_img" src="<%=basePath%>web/base/images/static/kefu.png"/>
	<p class="link_icon">
	<c:forEach items="${customerList}" var="customer">
	 <a class="shouhou0 shouhou1" href="tencent://Message/?Uin=${customer.customerServiceQQ}&site=qq&menu=yes" target="_Blank"><input class="active" type="text" value="${customer.customerServiceName}"  style="border:none;"  onclick="window,location=this.parentNode.href;"  readonly="readonly"/></a> <!--.shouhou0為離線狀態，.shouhou1為線上狀態 -->
	</c:forEach>
	</p>
	<p class="kefu_phone">客服電話 <br />400-</p>
	<img class="kefu_erweima" src="kefu.png"/>
</div>
<script type="text/javascript">
var online = new Array();
</script>
<script type="text/javascript" src="${qqList}"></script>
<script type="text/javascript">
for (var i = 0; i < online.length; i++) {  
    if (online[i] == 0) { 
    	//此處是離線和線上顯示不同的css,可根據自己的情況修改
        $(".link_icon a").eq(i).find("INPUT").removeClass("active");
        $(".link_icon a").eq(i).removeClass("shouhou1");  
    } 
}  
</script>