仿開心網好友印象功能實現（收集而來備用）
阿新 • • 發佈：2019-01-23
<!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=gb2312"> <meta name="keywords" content="站長,網頁特效,網頁特效程式碼,js特效,js指令碼,指令碼,廣告程式碼,zzjs,zzjs.net,www.zzjs.net,站長特效 網" /> <meta name="description" content="www.zzjs.net,站長特效網，站長必備js特效及廣告程式碼。大量高質量js特效，提供高質量廣告程式碼下載,盡在站長特效網" /> <title>網頁特效 仿開心網好友印象 站長特效網歡迎您。</title> <style type="text/css"> .www_zzjs_net { width: 500px; padding: 10px; height: auto; overflow: hidden; text-align: center; font-family: tahoma,arial,simsun; } .www_zzjs_net span { height: 30px; white-space: nowrap; display: inline-block; cursor: pointer; } .www_zzjs_net a, .www_zzjs_net a:hover { padding: 8px; border: 2px #09e solid; color: #fff; line-height: 16px; font-weight: bold; font-size: 14px; text-decoration: none; position: relative; } input.cur { border: 1px #c00 outset; } </style> </head> <body> <a href="http://www.zzjs.net/">站長特效網</a>,站長必備的高質量網頁特效和廣告程式碼。zzjs.net，站長js特效。<hr> <div class="www_zzjs_net"> <span><a href="#">色鬼</a></span><span><a href="#">晒個</a></span><span><a href="#">不知道</a></span><span><a href="#">打黑工</a></span><span><a href="#">您懂個啥</a></span><span><a href="#">-……-</a></span><span><a href="#">休息</a></span><span><a href="#">帥氣</a></span><span><a href="#">天涯地方</a></span><span><a href="#">修復</a></span><span><a href="#">暗戀</a></span><span><a href="#">打工的人</a></span><span><a href="#">地方官</a></span><span><a href="#">速度</a></span><span><a href="#">地方</a></span><span><a href="#">互動</a></span><span><a href="#">少吃點</a></span><span><a href="#">南工大</a></span><span><a href="#">對方</a></span><span><a href="#">期望</a></span><span><a href="#">閃電狗</a></span><span><a href="#">打黑工</a></span><span><a href="#">您懂個啥</a></span><span><a href="#">-……-</a></span><span><a href="#">休息</a></span><span><a href="#">帥氣</a></span><span><a href="#">天涯地方</a></span><span><a href="#">修復</a></span><span><a href="#">暗戀</a></span><span><a href="#">打工的人</a></span><span><a href="#">地方官</a></span><span><a href="#">速度</a></span><span><a href="#">地方</a></span></div> <br /> <br /> <input type="text" value="站長特效評價" maxlength="4" id="input-txt" /> <input type="button" value="評價" id="input-btn" /> <input type="button" value="Clear" onclick="n = false" /> <script type="text/javascript"> var n = false; function isNum(temp) { var n, re = /^\d+$/; if (!re.test(temp)) { return true; } return false; } function isChinese(temp) { var m, re = /[^\u4e00-\u9fa5]/; var temps = temp.split(""); for (var i = 0; i < temp.split("").length; i++) { if (!re.test(temp.split("")[i])) { m = true; break; } } if (m) return true; return false; } function randomColor() { var arrHex = ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"]; var strHex = "#"; var index; for (var i = 0; i < 6; i++) { index = Math.round(Math.random() * 15); strHex += arrHex[index]; } return strHex; } function changeColor() { var links = document.getElementsByTagName("a"); for (var i = 0; i < links.length; i++) { var bgColor = randomColor(); links[i].style.backgroundColor = links[i].style.borderColor = bgColor; } } function sayHi() { var scolor, links = document.getElementsByTagName("a"); for (var i = 0; i < links.length; i++) { links[i].onmouseover = function () { scolor = this.style.backgroundColor; this.style.color = scolor; this.style.borderColor = scolor; this.style.backgroundColor = "white"; } links[i].onmouseout = function () { this.style.color = "white"; this.style.backgroundColor = this.style.borderColor = scolor; } links[i].onmousedown = function () { //if(n){ // alert("您已經評價過了"); // return false; //} alert('您對sky的印象是 "' + this.childNodes[0].nodeValue + '"'); n = true; } } } function addEvaluation() { var txt = document.getElementById("input-txt"); var btn = document.getElementById("input-btn"); var divs = document.getElementsByTagName("div")[0]; if (!txt) return false; if (!btn) return false; var texts, links, spans; txt.onfocus = function () { btn.className = "cur"; } txt.onblur = function () { btn.className = ""; } btn.onclick = function () { if (n) { alert("您已經評價過了"); return false; } if (txt.value == "") { alert("請輸入一個印象詞"); return false; } if (txt.value !== "2") { if (!isNum(txt.value)) { alert("請輸入一個印象詞"); return false; } } texts = document.createTextNode(txt.value); links = document.createElement("a"); spans = document.createElement("span"); links.appendChild(texts); links.style.backgroundColor = links.style.borderColor = randomColor(); spans.appendChild(links); divs.appendChild(spans); sayHi(); n = true; } } changeColor(); sayHi(); addEvaluation(); </script> </body> </html>