用于捕获时间跨度或持续时间的UI

HS.*_*HS. 6 user-interface

什么是用于从用户捕获持续时间的基于Web的良好UI.让我们说我们想要在几分钟内捕获持续时间.但是想要呈现它以便用户可以在几小时和/或几分钟内输入.

只需使用2个文本框hrs\min?或者单个文本框让他们输入"1小时31分钟"或"91分钟"?

还是有更好的东西?

HS.*_*HS. 2

感谢您的所有反馈。

我最终做的是,有一个文本框,以“xxhrs yymin”格式显示持续时间

用户可以对其进行编辑,当焦点从文本框移开时,它会重新计算持续时间并将文本重新格式化为规范形式。

解释输入文本的解析器相当自由。

它是一组正则表达式,用于匹配任何数字,后跟“h”或“m”或“d”来表示小时、分钟和天。如果它没有找到任何前面有数字的“单位”,它会假设您输入了一个纯数字作为分钟,并将如此解释它。

因此,如果用户输入:

“1.5h”,离开文本框后将重新格式化为“1hr 30min”。

“90 分钟”也将重新格式化为“1 小时 30 分钟”

解析器只查看数字后面的第一个字符,这意味着您可以输入“1 天,7 小时 19 分钟”,它会正确识别它。

当然,它也会将“2 个洞和 19 只老鼠”识别为“2 小时 19 分钟”。

我想我可以忍受这一点。