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

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
}