javascript - 当用户单击另一个表单组时，如何验证出生日期？

Question

请参阅下面的代码:

 <div class="form-group" onblur="ValidateDateOfBirth()">
                <label class="control-label" style="width: 30%;">
                    Date of Birth
                </label>
                <input asp-for="DayOfBirth" style="width: 10%;" class="form-control" />
                <input asp-for="MonthOfBirth" style="width: 10%;" class="form-control" />
                <input asp-for="YearOfBirth" style="width: 10%;" class="form-control" />
            </div>

我希望当用户离开三个文本框(表单组)时验证出生日期，但是什么也没有发生。如果我将事件从 onBlur 更改为 onChange，则如果三个文本框中的任何值发生更改，则会验证出生日期。

用户点击另一个表单组后如何验证出生日期？

Answer 1

div 不会触发 blur 事件。曾经。这只是基本的 EMCAScript 规范内容。 blur 事件只会由各个输入触发。由于您的问题归结为需要等到所有三个字段都完成后再触发验证，因此您需要检查三个输入是否是“脏”。换句话说，为每个输入添加 onblur 验证。然后，在您的验证方法中:

// get values of day, month, and year inputs
if (day.trim() !== '' && month.trim() !== '' && year.trim() !== '') {
    // run validation
}