求一个 js 写法,弹出的选择器如何选中中间的 li(弹出有的滚动条,滚上滚下自动选中中间的 Li)

2022-04-24 16:53:53 +08:00
 DreamCMS
810 次点击
所在节点    问与答
13 条回复
DreamCMS
2022-04-24 16:54:56 +08:00
滚动上下的时候,自动选中中间的 LI ,给他 addclass class=this
nitmali
2022-04-24 16:58:59 +08:00
没看懂
pendulum
2022-04-24 17:00:26 +08:00
什么是“弹出有的滚动条”
DreamCMS
2022-04-24 17:01:09 +08:00
@nitmali 选日期不是有类似的 pick 吗,滚动自动选中中间的值
DreamCMS
2022-04-24 17:02:07 +08:00
@pendulum 就是跟日期的一直滚动选中中间的 pick
nitmali
2022-04-24 17:04:32 +08:00
你说的不会是鼠标悬停效果吧
marcong95
2022-04-24 17:06:24 +08:00
li 元素又不接受焦点,DateTimePicker 那种不都是自己实现的么,算好位置之后设置 CSS transform: translateY(xx); 这种感觉
nitmali
2022-04-24 17:08:07 +08:00
我知道你说的什么了。

固定弹出层高度和子项高度,监听滚动,计算滚动距离和修正滚动,可以计算出当前显示在中间的子项
DreamCMS
2022-04-24 17:20:35 +08:00
@nitmali 哈哈哈,已经有意思了,获取可视高度,再计算中间坐标,再选择监听滚动条的位置计算得出中间的变化的坐标
snoopyhai
2022-04-24 17:22:27 +08:00
https://vant-contrib.gitee.io/vant/v2/#/zh-CN/picker

这玩意, 其中有个参数叫 default-index

找找源码, 看看如何实现的.
tyx1703
2022-04-24 18:45:50 +08:00
抛砖引玉,实现了一个轻量版的: https://output.jsbin.com/begibifaza
f0rger
2022-04-24 19:47:04 +08:00
能找到对应 li 然后 scrollIntoView 吗
DreamCMS
2022-04-24 22:54:37 +08:00
@tyx1703 牛逼~

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/848964

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX