E3.05.3select current value always visible设计
下拉的当前值必须始终可见
别名: 下拉当前值 · selected value visible · 收起回显
概念解释
下拉无论收起还是打开,当前值(selected value)都要作为稳定对象留在触发器上。收起时它是这一字段的全部可读内容;打开时它仍应能被认出——高亮在列表里,同时触发器上的文字不要被「请选择」或搜索框顶掉。当前值消失,字段就变成一个不知存了什么的按钮,核对、截图、辅助技术的「已选」播报都会断。
始终可见说的是值本身,不是列表是否打开。列表可以滚动到看不见已选项,但触发器或一条钉住的摘要必须还在说那个值。
机制
人把关闭的下拉当只读标签来扫:扫表单时不会先点开再确认。触发器若显示占位符、空白或被图标挤没文字,扫视会把它当成未填,即使用户上周就选过。打开状态下,注意力转入列表,触发器上的值是回到「我已经选了什么」的锚;列表里的高亮会滚出视野,锚不能一起滚走。
过滤和搜索会改写触发器内容。输入关键字时,若把当前值换成关键字,取消过滤后值似乎丢了——其实还在模型里,只是界面把锚借走了。占位「请选择」和真实值必须互斥出现:有值时占位让位,无值时占位才能露面。
边界
多选下拉的当前值不是单个词,而是摘要;那是另一类控件的可见性规则,单选下拉不能靠「已选 3 项」交差。级联里上级一变,下级当前值可能失效,失效要显示为空或校验错误,而不是继续展示已作废的旧值——「始终可见」不等于「始终展示过期值」。超长标签在窄触发器里会被截断,截断后必须仍能辨认独有部分(国家代码、ID),或允许触发器换行,不能只剩省略号。只在打开列表时用对勾标已选、收起后触发器空白,是把可见性做成了瞬态。
怎么落地
- 收起态触发器只显示当前值或明确的空占位,二者不要叠在一起。
- 打开列表时保持触发器上的值,过滤输入用独立的搜索框,不要征用触发器当输入。
- 已选项在列表中滚出视野时,不要把触发器改成当前高亮项的预览,除非那就是新的已选。
- 验证:选一个值,关闭,滚动页面再扫回来;再打开列表滚动到远处。两处都能不假思索读出已选,才算始终可见。