jQuery datepicker无法正确更新值 [英] jQuery datepicker does not update value properly

查看:141
本文介绍了jQuery datepicker无法正确更新值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我当前正在使用的网站上,我有一个添加事件的表格.此事件需要一个日期,用户可以使用jQuery datepicker选择该日期.一个日期只能有一个事件.因此,我想检查用户在日期选择器中插入的日期.我尝试通过在用户选择日期后获取值来做到这一点.问题是,日期选择器不会立即更新其值.

我制作了一个JSFiddle来显示问题.当您选择一个日期时,跨度会更新并显示日期选择器的值.但是如您所见,它第一次是空白的,而第二次它显示了先前选择的日期.因此,日期选择器不会立即更新是有价值的.我怎样才能解决这个问题?

我在这里研究了关于stackoverflow的其他类似问题,但是他们的解决方案对我不起作用.

JSFiddle:: http://jsfiddle.net/kmsfpgdk/

HTML:

<input type="text" id="datepicker" name="date" />
<span id="data"></span>

JS:

$('#datepicker').datepicker();

$('#datepicker').blur(function () {
    var val = $(this).val();
    $('#data').text(val);
});

解决方案

最好使用内置方法onSelect:fn来使用:

$('#datepicker').datepicker({
   onSelect: function () {
       $('#data').text(this.value);
   }
});

小提琴


根据文档:

onSelect

在选择日期选择器时调用.该函数以文本形式接收所选日期,并以参数形式接收datepicker实例. 是指关联的输入字段.

On the website I'm currently working I have a form to add a event. This event needs a date which the user selects using a jQuery datepicker. A date can only have one event. So I want to check the date the user insert in the datepicker. I tried doing this by getting the value after the user has selected the date. The problem is however, the datepickers doesn't update his value right away.

I made a JSFiddle to show the problem. When you pick a date the span updates and shows the value of the datepicker. But as you can see the first time it is blank, and the second time it shows the previous selected date. So the datepickers does not update is value right away. How can I fix this?

I looked trough other similar questions here on stackoverflow but their solutions didn't work for me.

JSFiddle: http://jsfiddle.net/kmsfpgdk/

HTML:

<input type="text" id="datepicker" name="date" />
<span id="data"></span>

JS:

$('#datepicker').datepicker();

$('#datepicker').blur(function () {
    var val = $(this).val();
    $('#data').text(val);
});

解决方案

Its better to use built in method onSelect:fn to use:

$('#datepicker').datepicker({
   onSelect: function () {
       $('#data').text(this.value);
   }
});

Fiddle


As per documentation:

onSelect

Called when the datepicker is selected. The function receives the selected date as text and the datepicker instance as parameters. this refers to the associated input field.

这篇关于jQuery datepicker无法正确更新值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆