附加到jQuery Datepicker模糊事件

时间:2012-10-29 17:57:33

标签: jquery jquery-ui javascript-events datepicker blur

我正在开发一个用于文本框的jQuery插件,我希望它可以使用jQueryUI小部件来使用文本框,例如datepicker。这导致我出现问题,因为似乎在实际设置值之前抛出了datepicker上的blur事件。

我使用的解决方法是在执行代码之前设置超时,以便为datepickers值设置时间。见下面的代码:

$(this).blur(function() {
    // $(this).val() == ""
    var elem = $(this);
    setTimeout(function() {
        //elem.val() != ""
    },100);
});

我不确定这种解决方法是解决问题的最佳解决方案,或者即使它始终有效。如果我将超时设置为10毫秒而不是100,则它不起作用 - 我担心如果代码因任何原因而执行起来很慢100可能并不总是足够。

有人能想到更好的解决方案吗?

3 个答案:

答案 0 :(得分:6)

最后,我的解决方案是动态挂钩到onClose事件,如果有问题的文本框由datepicker使用(通过检查hasDatepicker类)。这样做的问题是你不能像往常那样绑定到事件,因为datepicker只能将一个函数附加到它的特定事件上。为了解决这个问题,我检查是否已经附加了一个函数,如果是,请在我的代码之后调用它:

var elem = $(this);
var someFunction = function() {
    //elem.val() != ""
}
if (elem.hasClass('hasDatepicker')) {
    var onClose = elem.datepicker('option','onClose');
    elem.datepicker('option','onClose', function() {
        someFunction();
        if (onClose) { onClose(elem.val()); }
    });
} else {
    elem.bind('blur',someFunction);
}

答案 1 :(得分:5)

在datepicker中有几个事件你可以绑定到onSelectonClose,其中this是作为datepicker选择器的输入。 您可以使用datepicker ui参数来获取值

$(selector).datepicker({
     onClose:function(evt, ui){             
          $(this).myPlugin('someMethod');
     })
})

答案 2 :(得分:1)

这是更简单的方法:

$('#element').datepicker({
    onClose: function() {
        $(this).trigger('change');
    }
});


$('#element').bind('change',function(){
    // someFunction();
});