javascript - jquery datepicker - 如何使只读和必需？

Question

我正在创建一个表单，客户已请求“eventStart”和“eventStop”范围，他们也希望它是必需的，并且不希望任何人能够手动更改这些值。

我正在使用 jquery datePicker 和 jquery validate。

我让它以一种或另一种方式工作，但不能同时使用这两种方式。

<input class="inputs" type="text" id="eventStart"  readonly/>
<input class="inputs" type="text" id="eventStop"  readonly/>

这非常有效，范围有效，并且无法手动编辑。

<input class="inputs" type="text" id="eventStart"  required/>
<input class="inputs" type="text" id="eventStop"  required/>

这会弹出“!请填写此字段”，但允许手动编辑日期。

如果我同时放两者，它允许用户跳过该字段(无验证。)

Answer 1

在这种情况下，如果您添加 readonly 和 required 并且它绕过验证，您的选择是实现您自己的验证或 Hook 表单提交或提交按钮的 onclick 操作。

另一种选择是只使用必需的。然后 Hook keydown Action 并停止文本输入。

$("#inputs").keydown(function (event) {
    event.preventDefault();
});

这只会阻止文本输入并且不安全。偷偷摸摸的人仍然可以根据需要更改该值。不要忘记在后端验证字段输入。