请教一个问题，前端大佬们进！

[einq7]

请教下各位前端大佬，在移动端下，原生 select 控件首次打开下拉框时，如何默认定位到一个指定 option ？因为目标用户是中老年人群体，所以在注册页选择出生年份时，产品经理希望首次选择时能从一个比较靠近的年份开始，比如 1980 年，帮用户省些事。

可能我的文字描述的会有些不清楚，我用 pr 剪出了一个 gif ，期望的效果可以参考下面这张 gif(注意不是选中该 option ，select 框中的值并没有改变)

貌似 select 控件本身并没有提供这样一个 api ，所以过来求助下各位大佬。我搞了个 codesandbox ，大佬们可以直接在上面改改看。

[slmaaw]

<option key={year} selected={year===1980}>{year}</option>

[einq7]

@slmaaw #1 感谢回复，但是这样初始就选中了 1980 这个选项了，我希望的是首次打开下拉框时，停留在 1980 这个选项，并不选中它，select 控件中显示的还是"请选择出生年份"这个选项，效果可以参考帖子正文中那个 gif 图

[hronro]

@einq7 #2 那你自己实现一个 Select 控件吧，原生的没这功能

[Elix]

"因为目标用户是中老年人群体"，........从一个比较靠近的年份开始，比如 1980 年
70 后有觉得被冒犯到 {doge}

[EPr2hh6LADQWqRVH]

两个 select ，展示一个动作一个，展示的那个 onclick 拦截，给动作的那个 click(), 动作的那个 change 的时候把值赋给展示的那个，最后用展示的那个。

这个套路会了吗

[learnshare]

点击的时候，判断有没有值，没有就设置默认值

[retrocode]

5 楼的方法可靠

[rabbbit]

原生的 select 不能被 click 触发吧,是我记错了,还是又改了?

[rabbbit]

写了个 demo 试了下, android chrome 不行, ios 14 safari 可以

[v3xe]

我是第十个大佬。

[einq7]

@learnshare #6 大佬我准备换成你说的这种交互方式，改了以后，select 框中的值确实设置正确了，但是点击后弹出的选择框还是停留在第一个选项"请选择你的出生年份"，而不是我设置的"1980"，请问这是什么原因导致的问题？具体你可以看下我主题正文下 append 的内容。

[einq7]

@rabbbit #9 大佬，可以贴下你的 demo 代码参考一下吗

[gouflv]

select 全透明盖在文字上：
1.点击由 select 处理
2.文字内容完全可控

[coolan]

@gouflv 这应该是唯一答案。

[TomVista]

一个 select 一个 input 联动,

select 默认 1980, input 默认请选择生日

select onclose onchange 联动 input

[learnshare]

@einq7 试试在合适的时候给 option 添加 selected 属性

[einq7]

@avastms @gouflv @TomVista @learnshare

感谢各位我整出来了。几位大佬说的应该是同一个思路，input 用来展示，select 全透明放置在 input 上方，点击选择后切换 input 里的值，完全符合需求，甚至之前 select 不支持 placeholder ，现在这样搞也支持了，大佬们牛逼！这种套路咱是想破脑袋也想不到（跪了