jqueryUI datepicker 在传递日期之前触发输入的模糊，避免/解决方法? [英] jqueryUI datepicker fires input's blur before passing date, avoid/workaround?

问题描述

我对绑定到它的模糊事件的文本输入进行了一些验证.我在这个字段上有一个日期选择器(来自 jqueryUI 的版本)，所以当你点击这个字段时，日期选择器会出现，然后你点击一个日期，它会像 datepicker 一样将日期填充到该字段中.但是，就在输入日期之前，输入字段似乎由于某种原因而变得模糊.在填充日期之前，焦点似乎从输入中消失了.所以我的验证会在用户选择一个日期时触发，在日期实际进入该字段之前，当它不应该时.它应该在输入日期后运行.有谁知道为什么会在那时发生模糊或如何解决它?

I have some validation on a text input bound to its blur event. I have a datepicker on this field (the version from jqueryUI), so when you click the field, datepicker shows up, then you click a date and it populates the date into the field as datepicker does. However, right before the date is entered it seems the input field gets its blur fired for some reason. It looks like focus goes away from the input before the date gets populated. So my validation gets fired right at the point when the user selects a date, before the date actually makes its way into the field, when it shouldn't. It should be running after the date gets put in. Does anyone know why the blur is is happening at that point or how to work around it?

推荐答案

当用户点击输入框外(选择日期)时，输入框会模糊.没有办法解决这个问题.因此，不要触发模糊验证，而是使用日期选择器的 onSelect 回调.

When the user clicks outside the input field (to choose a date), the input field will blur. There's no way around that. So, instead of triggering the validation on blur, use the datepicker's onSelect callback.

$('.selector').datepicker({
    onSelect: function(dateText) { /* validation here */ }
});

如果您想保留 onblur 事件，您可以推迟验证以允许日期选择器在验证触发之前填写该字段，如下所示:

If you want to keep your onblur-events, you could postpone validation to allow for the datepicker to fill out the field before the validation fires, like this:

$('#myform input').blur(function () {
    setTimeout(function () { /* validation here */ }, 1);
});

使用 setTimeout 处理并发问题可能看起来像一个黑客，但由于 JavaScript 的单线程性质，它工作得非常好.jQuery-fame 的 John Resig 在这篇博文中谈到了它.

Using setTimeout to handle concurrency-issues may look like a hack, but due to JavaScripts single-threaded nature, it works quite nicely. John Resig of jQuery-fame talks about it in this blogpost.

这篇关于jqueryUI datepicker 在传递日期之前触发输入的模糊，避免/解决方法?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！