bootstrap-时间选择器输入验证

Question

上下文：

我正尝试在事件创建工具的 4 个不同 date/time 选择器上添加验证。

第一组日期和时间输入是事件开始Date/Time:

输入开始日期 - 此日期不能早于今天。

开始时间输入 - 这不需要验证。

第二组日期时间输入为事件结束Date/Time:

结束日期输入 - 这不能早于开始日期，但可以与开始日期相同。

结束时间输入 - 如果结束日期与开始日期相同，则结束时间不能早于开始时间。如果结束日期晚于开始日期，则结束时间可以是任何时间。

这里是HTML:

<p>
<table>
    <tr>
        <td>
            <label>Event Start Date</label>
            <span class="input-append bootstrap-timepicker">
                <input type="text" runat="server" id="eventstartdate" name="eventstartdate" readonly="true" class="input-small" />
            </span>
        </td>
        <td>
             <label>Event Start Time</label>
             <span class="input-append bootstrap-timepicker">
                 <input runat="server" id="timepicker1" type="text" readonly="true" class="input-small">
             </span>

        </td>
    </tr>
</table>
</p>

<p>
<table>
    <tr>
        <td>
            <label>Event End Date</label>
            <span class="input-append bootstrap-timepicker">
                <input type="text" runat="server" id="eventenddate" name="eventenddate" readonly="true" class="input-small" />
            </span>
        </td>
        <td>
            <label>Event End Time</label>
            <span class="input-append bootstrap-timepicker">
                <input runat="server" id="timepicker2" type="text" readonly="true" class="input-small">
            </span>
        </td>
    </tr>
</table>

</p>

诀窍在于 我不想在单击提交按钮时进行验证。我想防止用户输入无效的date/time。

我有点不知所措，我什至不知道从哪里开始。任何帮助将不胜感激！

Answer 1

您应该使用 jquery .on("change", function()) 方法将事件侦听器添加到日期选择器。然后，每次更改日期选择器值时，您的代码都会启动。

bootstrap-时间选择器输入验证

bootstrap-timepicker input validation

html

javascript

validation

jquery

bootstrap-timepicker