资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
javascript 仿开心网好友印象功能(点击文字弹出印象框)
<!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="author" content="Chomo" /> <link rel="start" href="http://www.glzy8.com" title="Home" /> <title>仿开心网好友印象功能</title> <style type="text/css"> .box{ width:500px; padding:10px; height:auto; overflow:hidden; text-align:center} .box span{ line-height:30px; height:30px;white-space:nowrap; display:inline-block; cursor:pointer} .box a,.box a:hover{ padding:10px;color:#fff; line-height:16px;font-weight:bold; font-size:14px;text-decoration:none; position:relative; border:0;} .box a:hover{ border:2px #09e solid;padding:8px;} input.cur{ border:1px #c00 outset} </style> </head> <body> <div class="box"><span><a href="#" _ewebeditor_ta_href="%23">色鬼</a></span><span><a href="#" _ewebeditor_ta_href="%23">你懂个啥</a></span><span><a href="#" _ewebeditor_ta_href="%23">-……-</a></span><span><a href="#" _ewebeditor_ta_href="%23">休息</a></span><span><a href="#" _ewebeditor_ta_href="%23">帅气</a></span><span><a href="#" _ewebeditor_ta_href="%23" >天涯地方</a></span><span><a href="#" _ewebeditor_ta_href="%23">无法形容</a></span><span><a href="#" _ewebeditor_ta_href="%23" >才子</a></span></div> <input type="text" value="asd" maxlength="20" id="input-txt"/><input type="button" value="评价" id="input-btn"/> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%20%0D%0Afunction%20randomColor()%20%7B%20%20%20%20%2F%2F16%E8%BF%9B%E5%88%B6%E6%96%B9%E5%BC%8F%E8%A1%A8%E7%A4%BA%E9%A2%9C%E8%89%B20-F%20%20%20%20%20%0D%0A%20%20%20%20var%20arrHex%20%3D%20%5B%220%22%2C%221%22%2C%222%22%2C%223%22%2C%224%22%2C%225%22%2C%226%22%2C%227%22%2C%228%22%2C%229%22%2C%22A%22%2C%22B%22%2C%22C%22%2C%22D%22%2C%22E%22%2C%22F%22%5D%3B%20%20%20%20%20%0D%0A%20%20%20%20var%20strHex%20%3D%20%22%23%22%3B%20%20%20%20%20%0D%0A%20%20%20%20var%20index%3B%20%20%20%20%20%0D%0A%20%20%20%20for(var%20i%20%3D%200%3B%20i%20%3C%206%3B%20i%2B%2B)%20%7B%20%20%20%20%2F%2F%E5%8F%96%E5%BE%970-15%E4%B9%8B%E9%97%B4%E7%9A%84%E9%9A%8F%E6%9C%BA%E6%95%B4%E6%95%B0%20%20%20%20%20%0D%0A%20%20%20%20%20%20%20%20index%20%3D%20Math.round(Math.random()%20*%2015)%3B%20%20%20%20%20%20%20%20%20%0D%0A%20%20%20%20%20%20%20%20strHex%20%2B%3D%20arrHex%5Bindex%5D%3B%20%0D%0A%20%20%20%20%7D%20%20%20%20%20%0D%0A%20%20%20%20return%20strHex%3B%20%0D%0A%7D%20%0D%0Afunction%20changeColor()%7B%20%0D%0A%20%20%20%20var%20links%20%3D%20document.getElementsByTagName(%22a%22)%3B%20%0D%0A%20%20%20%20for(var%20i%3D0%3Bi%3Clinks.length%3Bi%2B%2B)%7B%20%0D%0A%20%20%20%20%20%20%20%20var%20bgColor%20%3D%20randomColor()%3B%2F%2F%E6%94%B9%E5%8F%98%E8%83%8C%E6%99%AF%E8%89%B2%E7%9A%84%E4%BB%A3%E7%A0%81%EF%BC%8C%E6%A0%B9%E6%8D%AE%E4%BF%AE%E5%8E%BB%E4%BF%AE%E6%94%B9%E3%80%82%20%0D%0A%20%20%20%20%20%20%20%20links%5Bi%5D.style.backgroundColor%20%3D%20bgColor%3B%20%0D%0A%20%20%20%20%7D%20%0D%0A%7D%20%0D%0Afunction%20sayHi()%7B%20%0D%0A%20%20%20%20var%20scolor%2Clinks%20%3D%20document.getElementsByTagName(%22a%22)%3B%20%0D%0A%20%20%20%20for(var%20i%3D0%3Bi%3Clinks.length%3Bi%2B%2B)%7B%20%0D%0A%20%20%20%20%20%20%20%20links%5Bi%5D.onmouseover%20%3D%20function()%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20scolor%20%3D%20this.style.backgroundColor%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20this.style.color%20%3D%20scolor%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20this.style.borderColor%20%3D%20scolor%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20this.style.backgroundColor%20%3D%20%22white%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20links%5Bi%5D.onmouseout%20%3D%20function()%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20this.style.color%20%3D%20%22white%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20this.style.borderColor%20%3D%20%22%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20this.style.backgroundColor%20%3D%20scolor%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20links%5Bi%5D.onmousedown%20%3D%20function()%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20alert('%E4%BD%A0%E5%AF%B9XXX%E7%9A%84%E5%8D%B0%E8%B1%A1%E6%98%AF%20%22'%2Bthis.childNodes%5B0%5D.nodeValue%2B'%22')%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%7D%20%0D%0A%7D%20%0D%0Afunction%20addEvaluation()%7B%20%0D%0A%20%20%20%20var%20txt%20%3D%20document.getElementById(%22input-txt%22)%3B%20%0D%0A%20%20%20%20var%20btn%20%3D%20document.getElementById(%22input-btn%22)%3B%20%0D%0A%20%20%20%20var%20divs%20%3D%20document.getElementsByTagName(%22div%22)%5B0%5D%3B%20%0D%0A%20%20%20%20if(!txt)%20return%20false%3B%20%0D%0A%20%20%20%20if(!btn)%20return%20false%3B%20%0D%0A%20%20%20%20var%20texts%2Clinks%2Cspans%3B%20%0D%0A%20%20%20%20txt.onfocus%20%3D%20function()%7B%20%0D%0A%20%20%20%20%20%20%20%20btn.className%3D%22cur%22%3B%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20txt.onblur%20%3D%20function()%7B%20%0D%0A%20%20%20%20%20%20%20%20btn.className%3D%22%22%3B%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20btn.onclick%20%3D%20function()%7B%20%0D%0A%20%20%20%20%20%20%20%20if(txt.value%3D%3D%22%22)%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20alert(%22%E8%AF%B7%E8%BE%93%E5%85%A5%E4%B8%80%E4%B8%AA%E5%8D%B0%E8%B1%A1%E8%AF%8D%22)%3B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20false%20%0D%0A%20%20%20%20%20%20%20%20%7D%3B%20%0D%0A%20%20%20%20%20%20%20%20texts%20%3D%20document.createTextNode(txt.value)%3B%20%0D%0A%20%20%20%20%20%20%20%20links%20%3D%20document.createElement(%22a%22)%3B%20%0D%0A%20%20%20%20%20%20%20%20spans%20%3D%20document.createElement(%22span%22)%3B%20%0D%0A%20%20%20%20%20%20%20%20links.appendChild(texts)%3B%20%0D%0A%20%20%20%20%20%20%20%20links.style.backgroundColor%20%3D%20randomColor()%3B%20%0D%0A%20%20%20%20%20%20%20%20spans.appendChild(links)%3B%20%0D%0A%20%20%20%20%20%20%20%20divs.appendChild(spans)%3B%20%0D%0A%20%20%20%20%20%20%20%20sayHi()%3B%20%0D%0A%20%20%20%20%7D%20%0D%0A%7D%20%0D%0AchangeColor()%3B%20%0D%0AsayHi()%3B%20%0D%0AaddEvaluation()%3B%20%0D%0A%3C%2Fscript%3E"> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程