<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>javascript版QQ在線聊天</title> <script language="JavaScript" type="text/javascript"> var online=[];//定義返回數組結果,不可刪 //全部QQ號碼,ps:QQ號碼須要在:http://shang.qq.com/widget/set.php登錄開通服務。不然不行。 var arr=['2604442887','2051745288','1848770385','1120133673','2803313065','2648742550','2094800395','2094513153','2669768587','2654708197','2806803604','2103969859','1774028571','2037063540','2094733504','2327791804','1253815649','2230046791','2103770755','1304620374','2093786904','2849914876','2857556863','2102872570','2813748275','2665689096','2104447022','2843331729','1158460366','1803024257','2568724744','2591950281','2655743296','2103288748','2545706138','2376968019','2105851980','2094285843','2016877549','2094655602','2103184634','1843771362','2328299466','2640794841','2058114350','2050633405','2258529381','2057854571','2093960197','2665560453','1989981124','1602153264','1514350293','402074938','363163864']; var my_arr=arr.join(":")+':'; var qq_url='http://webpresence.qq.com/getonline?Type=1&'+my_arr; /****************動態建立JS*********************/ var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = qq_url; head.appendChild(script); /***********判斷JS文件是否加載完成************/ function complete_load(js){ if ((navigator.userAgent.indexOf('MSIE') == -1) ? false: true) { js.onreadystatechange = function() { if (this.readyState && this.readyState == "loading") return; else creatHtml(); }; } else js.onload = function() { creatHtml(); }; js.onerror = function(){ alert('加載錯誤。請檢查文件路徑是否正確!') }; } complete_load(script); /*刪除數組索引方法*/ Array.prototype.remove=function(dx) { if(isNaN(dx)||dx>this.length){return false;} for(var i=0,n=0;i<this.length;i++) { if(this[i]!=this[dx]) { this[n++]=this[i] } } this.length-=1 } /*返回在線QQ*/ function getOnlineQq(arr){ var online_qq = new Array(); online_qq['online'] =[] online_qq['offline'] = []; for(var i=0;i<online.length;i++){ if(online[i]==1){ online_qq['online'].push(arr[i]); }else{ online_qq['offline'].push(arr[i]); } } if(online_qq['online'].length>=10){ online_qq['offline']=[]; online_qq['online'] = getRandQq(online['online'],10); }else{ var olength = 10- online_qq['online'].length; online_qq['offline'] = getRandQq(online_qq['offline'],olength); } return online_qq; } /*動態生成在線QQ*/ function creatHtml(){ var online_qq = getOnlineQq(arr); var qq_kefu = '<ul>'; for(var i=0;i<online_qq['online'].length;i++){ qq_kefu += '<li><em><img alt="" src="http://www.chinaskin.cn/themes/chinaskin/images/2013/tel_pic/qq1.png" /></em><a href="http://wpa.qq.com/msgrd?v=3&uin='+online_qq['online'][i]+'&site=qq&menu=yes" title="當即諮詢" target="_blank">'+online_qq['online'][i]+'</a></li>'; } for(var i=0;i<online_qq['offline'].length;i++){ qq_kefu += '<li><em><img alt="" src="http://www.chinaskin.cn/themes/chinaskin/images/2013/tel_pic/qq2.png" /></em><a href="http://wpa.qq.com/msgrd?v=3&uin='+online_qq['offline'][i]+'&site=qq&menu=yes" title="當即諮詢" target="_blank">'+online_qq['offline'][i]+'</a></li>'; } qq_kefu += '</ul>'; document.getElementById('webqq').innerHTML = qq_kefu; } //返回num個arr元素 function getRandQq(arr,num){ var narr = []; var index = 0; var sarr = arr; if(arr.length<=num){ return arr; }else{ for(i=0;i<num;i++){ index = Math.round(Math.random() * (arr.length-1)); narr.push(arr[index]); arr.remove(index); } return narr; } } </script> </head> <body> <!--webQQ[--> <style type="text/css"> img{ border:none;} *{ list-style:none; padding:0; margin:0;} a{ text-decoration: none;} .qqclear:after,.qqclear:before{content:""; display:table;} .qqclear:after{ clear:both;} .qqclear{*zoom:1;} .webqq{width:156px; height:405px;padding-left: 16px;padding-top: 39px; background:url(http://www.chinaskin.cn/themes/chinaskin/images/2013/tel_pic/qq_bg.gif) no-repeat; position: fixed; top:130px; right:0; z-index:99999;_position: absolute;_top: expression(documentElement.scrollTop+150);} .webqq li{ width:145px; height:39px; overflow:hidden; background:url(http://www.chinaskin.cn/themes/chinaskin/images/2013/tel_pic/no_hover.jpg) no-repeat; position:relative; zoom:1;} .webqq li:hover{ background: url(http://www.chinaskin.cn/themes/chinaskin/images/2013/tel_pic/hover.jpg) no-repeat; cursor:pointer;} .webqq li em{ position:absolute; display:block; width:24px; height:27px; left:5px; top:5px;} .webqq li a{ display:block; line-height: 58px; height: 39px; text-indent: 40px; color:#f00;} </style> <div class="webqq" id="webqq"> </div> <!--]end webQQ--> <div style="font-size:14px;"> ps:生成隨機十個在線的QQ。每次刷新從新隨機排序一次。。 </div> </body> </html>