前端頁(yè)面設(shè)計(jì)

前端主要采用bootstrap和jquery開(kāi)發(fā)，聊天室的頁(yè)面展示代碼在template/webqq/dashboard.html

主要設(shè)計(jì)分為：

對(duì)data_type的切換是聯(lián)系人還是群組，

聯(lián)系人搜索和列表的設(shè)計(jì)，

聯(lián)系人列表通過(guò)通過(guò)for循環(huán)取出

對(duì)在和誰(shuí)聊天名字的顯示，

聊天內(nèi)容和輸入框img，

以及登錄頁(yè)面。

主要代碼

• 聯(lián)系人
• 群組

{% for contact in request.user.userprofilehpy.friends.select_related %}

0

{{ contact.name }}

{% endfor %}

img

......

效果展示

用jquery實(shí)現(xiàn)選中聊天對(duì)象變色以及將把聊天人是誰(shuí)賦值給dialog-box-head

$(document).ready(function(){

//用遞歸，結(jié)束這個(gè)線程在進(jìn)行下一個(gè)，不用for

GetNewMsg_hpy();

/*不用setInterval每次用一個(gè)線程

RefreshMsgs = setInterval(function(){

//定時(shí)器3秒向后端請(qǐng)求

GetNewMsg_hpy();

},3000);*/

$("#contact-list a").click(function(){

//點(diǎn)中與誰(shuí)聊天的顏色改變，并且把名字賦予dialog-box-head

$ (this).addClass("active");

$(this).children("span").addClass("hide");

$(this).children("span").text("0");

$(this).siblings().removeClass("active");//同級(jí)別siblings,切換聊天人

//console.log("hello");

SwitchChatBoxhpy(this);

});

});

創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎(jiǎng)勵(lì)來(lái)咯，堅(jiān)持創(chuàng)作打卡瓜分現(xiàn)金大獎(jiǎng)

總結(jié)

以上是生活随笔為你收集整理的python webqq机器人_python模拟开发WebQQ（二）的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。