JavaScript使用输入框模拟Select实现美化效果

用模拟，是前端里一个挺常见也挺实用的小技巧。尤其在想美化原生又不想用太重的 UI 框架时，这招还蛮香的。响应快、样式好改、不容易被系统样式影响，嗯，确实挺省事。

常规做法是用配个弹出层，下拉选项自己控制渲染。这样一来，样式、交互全都你说了算。比如要加个搜索、图标，或者动画效果，原生可就麻烦多了。

你可以参考这个select 框美化特效，看起来挺顺眼的，也不复杂。还有这个图片+文本的下拉效果，也挺适合定制化场景的。

要注意的是，自己模拟的

，键盘无障碍支持得自己加，表单提交也要下，比如用隐藏同步值。别忽略这些，不然上线后可麻烦了。

如果你正准备做表单美化，又不想整个 UI 框架都引进，可以考虑试试用模拟的方式。搭配一些 JS 插件或者自己写逻辑都行，灵活得。

下载地址

用户评论

更多下载

下载地址

立即下载

用户评论