需求如下:

如图 这是搜索框的初始状态

(朴实无华 有种纯洁的美)

要求当我们的搜索框获得光标时 边框颜色变为小米橙 并且会显示下拉框

效果如下:

(淡淡暖意 赏心悦目)

思路:给搜索框对象增添事件监听 当获得焦点时 就显示出下拉框 并变色 当失去焦点时就隐藏下拉框 并移除变色效果

分析:

我们可以先获取search对象 给他加上焦点事件 在操作函数中给ul改变display显示 和加上搜索框的橙色 失去焦点(‘blur’)之后再将之前的效果移除即可

这里框住的部分是要注意添加类名不需要加点

如图这里将类名加入到标签中 再加点语法就不对了 写CSS时加点就行了

同时要注意 这里使用ul.style.display=’block’直接添加为行内样式 权重很高!!!

感谢观看 未完待续>.<