datetime-local步骤不适用于移动设备

Question

<input type="datetime-local" step="1800"></input>

以上命令无法在手机上运行.我的手机上的步骤仍然是1分钟.

手机:iPhone 6,iOS 10,经过Safari和Chrome测试.

有帮助吗？

Answer 1

让我们首先解释一下属性step是如何工作的

步骤属性是一个数字，指定值必须遵循的粒度，或者特殊值any，如下所述。只有等于步进基础的值（如果指定了最小值，否则为值，如果两者都没有提供，则为适当的默认值）才有效。

字符串值 any 意味着不暗示任何步进，并且允许任何值（除非其他约束，例如最小值和最大值）。

注意：当用户输入的数据不符合步进配置时，用户代理可能会四舍五入到最接近的有效值，当有两个同等接近的选项时，更喜欢正方向的数字。

对于日期时间本地输入，step 的值以秒为单位给出，缩放因子为 1000（因为基础数值以毫秒为单位）。step 默认值为 60，表示 60 秒（或 1 分钟，或 60,000 毫秒）。

目前，尚不清楚与日期时间本地输入一起使用时，any 的值对于步骤意味着什么。一旦确定该信息，我们将立即更新。

可能的解决方案

要使用此属性，我们还应该指定另外 2 个属性：max和min

什么是max属性？

最晚接受的日期和时间。如果输入到元素中的值晚于此时间戳，则元素将无法通过约束验证。如果 max 属性的值不是遵循 yyyy-MM-ddThh:mm 格式的有效字符串，则该元素没有最大值。

该值指定的日期字符串必须晚于或等于 min 属性指定的日期字符串。

什么是min属性？

最早接受的日期和时间；早于此的时间戳将导致元素约束验证失败。如果 min 属性的值不是遵循 yyyy-MM-ddThh:mm 格式的有效字符串，则该元素没有最小值。

该值指定的日期字符串必须早于或等于 max 属性指定的日期字符串。

最终代码

<input type="datetime-local" max="2020-06-20T20:06" min="2020-02-20T02:20" step="60"></input>