请问一下大家,我挷定事件怎么一个都不能实现啊?你们的怎么可以啊?改变背景色 和 切换列表 都不能实现?<!DOCTYPE html><html><head><meta charset="UTF-8"><title>taobao demo</title><style type="text/css">/*应用字符集显示小icon. 小icon的字体文件,一般是个网络文件,也可以百度搜索一下,不同的浏览器会识别不同的字体,要写兼容性,维一的不同就是后缀不同而已.*/@font-face{font-family: iconfont;src:url(http://g.tbcdn.cn/tb/icon-font/1.1.5/iconfont.eot); src:url(http://g.tbcdn.cn/tb/icon-font/1.1.5/iconfont.eot?#iefix) format("embeddeb-opentype"), url(http://g.tbcdn.cn/tb/icon-font/1.1.5/iconfont.woff) format("woff"), url(http://g.tbcdn.cn/tb/icon-font/1.1.5/iconfont.ttf) format("truetype"), url(http://g.tbcdn.cn/tb/icon-font/1.1.5/iconfont.svg#uxiconfont) format("svg")}body{font:12px/1.5 tahoma,arial,sans-serif;}a{text-decoration: none;}.search-container{position: relative;}.search-tips{float: right;padding: 3px 0 0 15px;}.search-tips a{color: #6c6c6c;}.search-button{float:right;}.btn-search{background-image:url(images/%E7%BA%A2%E8%89%B2%E7%AE%AD%E5%A4%B4.png);width:100px;height:45px;border:0;cursor:pointer;}.search-common-panel{height: 39px;background-color: #f50;overflow: hidden;padding: 3px 0 5px 77px;}.search-common-panel input{height: 39px;line-height: 39px;width: 100%;border:0 none;outline: 0;background-color: #fff;}.search-common-panel i{position: absolute;top:14px;left:86px;z-index: 2;color: #ccc;}.iconfont{font-family: iconfont;font-size: 12px;font-style: normal;}ul{list-style: none;display: block;}ul,li{margin: 0;padding: 0;}.search-list{position: absolute;top:3px;left: 3px;width: 72px;height: 39px;overflow: hidden;background: #fff;border-left:1px solid #f6f6f6;border-right: 1px solid #e5e5e5;} .search-list li{display: none;height: 39px;line-height: 39px;overflow: hidden;text-align: center;} .search-list li a{color: #6c6c6c;} .search-list .selected{background: #f6f6f6;display: block;} .trigger-hover{height: auto;} .trigger-hover li{display: block;}</style></head><body><div><div id="search_tab"><ul><li id="tab_1"><a href="">宝贝</a></li><li id="tab_2"><a href="">店铺</a></li></ul></div><div><form action=""><div><a href="">高级<br/>搜索</a></div><div><button type="submit"></button></div><div><input type="text" x-webkit-speech=""/><i>O</i></div></form></div></div></body><script>//获取元素var getDOM = function (id) {return document.getElementById(id);};//事件挷定var addEvent = function (id,event,fn) {var el = getDOM(id)||document;if(el.addEventListener){el.addEventListener(event,fn,false);}else if(el.attachEvent){el.attachEvent('on'+event,fn);}};//鼠标移上展开列表addEvent('search_tab','mouseover',function(){this.className+=' trigger-hover';});//鼠标移上切换列表背景色addEvent('tab_1','mouseover',function(){if(this.className.indexof('selected')<0){ this.className+=' selected'; }});addEvent('tab_1','mouseout',function(){this.className='';});addEvent('tab_2','mouseover',function(){if(this.className.indexof('selected')<0){ this.className+=' selected'; }});addEvent('tab_2','mouseout',function(){this.className='';});//鼠标点击切换列表addEvent('tab_1','click',function(){getDOM('search_tab').className = 'search-list';});addEvent('tab_2','click',function(){getDOM('search_tab').className = 'search-list';});</script></html>
1 回答
已采纳
习惯受伤
TA贡献885条经验 获得超1144个赞
//正确代码如下
addEvent('tab_1','mouseover',function(){
if(this.className.indexOf('selected')<0){ //indexof ==> indexOf
this.className+=' selected';
}
});
//正确代码如下
addEvent('tab_2','mouseover',function(){
if(this.className.indexOf('selected')<0){ //indexof ==> indexOf
this.className+=' selected';
}
});
添加回答
举报
0/150
提交
取消