jquery - 如何处理日期选择器控件？

Question

我datepicker在文本框上使用 jquery ui 控件，同时我使用onblur事件进行验证。现在的问题是当单击文本框并出现日历时，当您在其中选择日期时，将在文本框上执行验证。我试图处理它，但它仍然出现了一秒钟。

这是代码

$(document).ready(function () {

    $("#date").datepicker({
        onSelect: function () {
            $("#span1").css("display", "none")
        }
    });
});

function check() {
    if ($("#date").val() == "") $("#span1").css("display", "inline-block");
}

为了更好地理解这里是jsFiddle 链接

编辑：最终解决方案：接受最接近的答案首先提出。

$("#date").datepicker({
    onClose: function() {
        check();
    }
});

Answer 1

您也可以在日期选择器关闭时调用检查，而不是输入框的模糊。

$("#date").datepicker({
    onSelect: function () {
        $("#span1").css("display", "none")
    },
    onClose: function() {
        check();
    }
});

Answer 2

使用setTimeout：

$(document).ready(function () {
    $("#date").datepicker({
        onSelect: function () {
            $("#span1").css("display", "none")
        }
    });
});


function check() {
    setTimeout(function(){
        if ($("#date").val() == "") 
            $("#span1").css("display", "inline-block")
            }, 100);
}

演示：http: //jsfiddle.net/dirtyd77/4Vp9D/26/

Answer 3

我可以建议使用这个轻量级插件，而不是自己发明轮子吗？ http://digitalbush.com/projects/masked-input-plugin/

它也可以很好地与 jQuery UI DatePicker 配合使用，并且可以让您不必对日期格式进行自己的验证。