jquery - jquery datepicker上的自定义动态验证直到第二个焦点才起作用

Question

我有一个带有验证的日期选择器，它会弹出一条消息和“！” 直到用户选择一个日期 - 然后它显示一个“O”代替“！” 并且一部分弹出窗口停留在屏幕上，表明您已完成此字段。

我遇到的问题是验证弹出窗口不会停留在屏幕上，直到您第二次将焦点放在日期选择器文本字段上。

使用验证 jquery 它有很多代码，所以我真的不想在这里全部包含它，但这里有一个jsfiddle

有什么想法为什么它不是第一次运行而是后续运行？

Answer 1

看起来好像blur()在选择和验证日期之前被调用。这是一个简单的解决方案：选择有效日期时淡入“O”，而不是模糊。

工作 JSFiddle 演示

Answer 2

问题存在于您的inputElementBlur(e)函数中。具体来说，你打电话

if (!$(e).attr("required") && ($(e).val() == "" 
         || $(e).val() == $(e).attr("defaultValue"))) {
        alert('sniarf!');
        $(blurredElement).next("div.tooltipContainer").find("span.formValid").fadeOut(100);
    }

我在那里添加了警报，以便您可以看到代码的行为。我看到，当defaultValue您在验证逻辑中使用该属性时，您实际上并没有在设置值时更新它。

Answer 3

There is no such thing as "defaultValue" attribute. It's a DOM property. Fixing that made the O appear after first pickings:

http://jsfiddle.net/LeXHE/9/

Then there was some logic error with:

if (!$(e).attr("required") && ($(e).val() == "" || $(e).val() === $(e).prop("defaultValue"))) {
    $(blurredElement).next("div.tooltipContainer").find("span.formValid").fadeOut(100);
}

Which I changed to:

if (!$(e).attr("required") && $(e).val() == "") {
    $(blurredElement).next("div.tooltipContainer").find("span.formValid").fadeOut(100);
}