Question

我有一个有很多用户的应用程序，我想让用户每个人选择他们想要开会的时间（在某种意义上），以便我们可以选择时间大多数用户都可以使用。

用户位于不同的时区。我想建立一个HTML5 / Javascript界面，它可以直接收集一天中的这些时间并将它们聚合在一起，同时考虑到时间差异，这样我就可以以一种易于查看的方式收集数据让大家聚在一起的最佳时机？

请考虑以下事项：

我想在可用的情况下使用受支持的HTML5表单字段和语义标记，而不是在Javascript中进行大量的二次计算。
我想在用户的当前时区显示时间选择，但是以一些标准化方式存储数据以跨时区进行比较。

我觉得Javascript Date toLocale...函数在这里会有所帮助，但仍然没有看到一种非常简单的方法。优雅的解决方案赞赏。

Answer 1

经过一些研究后发现，moment.js对于这个问题是完美的。

例如，我可以在相对于UTC的固定时间生成一个时刻列表：

# Default time selections: 9AM EST to 11PM EST
m = moment.utc(hours: 9 + 5).local()
return (m.clone().add('hours', x) for x in [0..14])

然后，我可以在用户的时区显示这些时间，同时将结果存储在固定的时区（例如，使用把手）：

<option value="" disabled selected>Select a time</option>    
{{#each momentList}}
    <option value="{{valueFormatted}}">{{displayFormatted}}</option>
{{/each}}

各自的助手

# Store all values in GMT-5
Template.tsTimeOptions.valueFormatted = -> @zone(300).format('HH ZZ')

# Display values in user's timezone
Template.tsTimeOptions.displayFormatted = -> @local().format('hA [UTC]Z')

这会生成如下HTML：

<select name="pickTime1" class="input-medium" required="">
    <option value="" disabled="" selected="">Select a time</option>    
    <option value="09 -0500">6AM UTC-08:00</option>    
    <option value="10 -0500">7AM UTC-08:00</option>    
    <option value="11 -0500">8AM UTC-08:00</option>    
    <option value="12 -0500">9AM UTC-08:00</option>    
    <option value="13 -0500">10AM UTC-08:00</option>    
    <option value="14 -0500">11AM UTC-08:00</option>    
    <option value="15 -0500">12PM UTC-08:00</option>    
    <option value="16 -0500">1PM UTC-08:00</option>    
    <option value="17 -0500">2PM UTC-08:00</option>    
    <option value="18 -0500">3PM UTC-08:00</option>    
    <option value="19 -0500">4PM UTC-08:00</option>    
    <option value="20 -0500">5PM UTC-08:00</option>    
    <option value="21 -0500">6PM UTC-08:00</option>    
    <option value="22 -0500">7PM UTC-08:00</option>    
    <option value="23 -0500">8PM UTC-08:00</option>
</select>

这实现了这样的目标：在以时间区域向用户询问时间，同时将所有结果存储为可以聚合的通用格式。

从几个不同时区的用户收集一天中的时间

1 个答案: