jQueryUI 内联 DatePicker 直到我更改月份后才起作用

Posted 2023-05-07

【中文标题】jQueryUI 内联 DatePicker 直到我更改月份后才起作用

【英文标题】：jQueryUI inline DatePicker doesn't work until after I change month

【发布时间】：2012-05-22 02:53:16

【问题描述】：

我正在使用带有 jquery 1.7.2 和 jqueryui 1.8.20 的内联 Datepicker。我遇到的问题是，在我更改日期选择器中的月份之前，以下内容不起作用，然后它就可以正常工作。任何帮助将不胜感激。

$( "#datepicker" ).datepicker( 
       dateFormat: 'D, dd M yy',
       minDate:0,
       onSelect: function(dateText, inst) 
            //$('.field_pickDate').html(dateText);
            alert('boo');
            //console.log(dateText);
         
    );

dateFormat 和 minDate 都在工作，但 onSelect 事件并没有从一开始就触发。

【问题讨论】：

“不起作用”到底是什么意思？

抱歉，这意味着单击日期不会选择它或使警报出现（或回调中的任何内容执行）。

更新：如果我用 input#datepicker 替换 div#datepicker 元素，它可以正常工作。然而，它是一个移动项目，因此内联在 UI 中更有意义。

您是否在页面上多次使用 ID“datepicker”？

不，虽然我也在页面上使用了 2 个 jqueryui 按钮集

【参考方案1】：

这是该事件的默认功能。

当用户在日期选择器中“选择”某些内容时触发。

要在点击时调用事件（在显示日期选择器之前），您可以使用“beforeShow”。

$( "#datepicker" ).datepicker( 
       dateFormat: 'D, dd M yy',
       minDate:0,
       beforeShow: function(input, inst) 
             alert("Fired on click, before the picker is shown");
       ,
       onSelect: function(dateText, inst) 
            //$('.field_pickDate').html(dateText);
            alert('boo');
            //console.log(dateText);
         
    );

这是一个使用您的代码的 JSFiddle 示例。

http://jsfiddle.net/applehat/jukJa/1/

您总是可以在文本框中添加另一个事件，例如 $('#datepicker').select(function() /* do something */ ); 同样，如果您想检测他们选择的字段。

================= 编辑===============

由于您将其用作内联元素，我不确定您的问题是什么。我在这里更新了我的 JSFiddle：http://jsfiddle.net/applehat/jukJa/2/

这里一切正常，所以也许您还有其他代码导致问题？

【讨论】：

这是一个内联日期选择器。它附加到 div#datepicker 而不是输入

我怀疑这也与它有关，但它被设计为内联附加：jqueryui.com/demos/datepicker/#inline。

更新了我的 JSFiddle (jsfiddle.net/applehat/jukJa/2) - 这似乎工作正常。在没有看到所有代码的情况下，我只能假设是其他原因导致了问题。

另外，请查看jsfiddle.net/applehat/jukJa/3，了解我认为您正在尝试做的更详细的示例。

日期选择器在就绪事件之前触发。 webapp 运行在一个复杂的基于 jQuery 的、phonegap 兼容的 MVC 风格框架上。更改月份可能会初始化日期选择器，隐藏事件顺序错误。