1

我正在为 jQuery UI 的 datepicker 使用 Trent Richardson 的出色的 Datetimepicker 插件。

然而，我希望解决的一个问题是，当您选择一个字段，然后浏览它时，输入字段中的日期值会发生变化。因此，如果您选择了一个日期，然后决定导航以查看其他选项，它会在此过程中更改日期。

例如，您可以在此处查看示例页面（使用下拉菜单而不是滑块）。

这是我的初始化代码：

$('input[name=valueTextField]').addClass('datepicker');

                $( ".datepicker" ).datetimepicker({
                        dateFormat: 'm/d/yy ',
                        timeText: 'Test',
                        controlType: 'select',
                        timeFormat: "h:mm TT",
                        ampm: true,
                        onChangeMonthYear: function(year, month, dpInst, tpInst) {
                            alert(dpInst);
                            alert(dpInst.dateDefined);
                            if(!tpInst.timeDefined && !dpInst.dateDefined) {
                                this.value = '';
                                dpInst.dateDefined = null;
                            }
                            if (dpInst.dateDefined) {

                            }
                        },
                        onSelect: function(date, dpInst) {
                            dpInst.dateDefined = true;
                        }

                });
                $("#ui-datepicker-div").addClass("meta_datepicker");
                $('input[name=valueTextField]').attr('readonly', 'readonly');

你可以在这里看到一个 JSFiddle 。

4

1 回答 1

1

keyup您可以在每个and之后保存以前的值，并在 a orselect期间恢复它：changeMonthYearclose

$( ".datepicker" ).datetimepicker({
    ...
    onSelect: function() {
        $(this).data("oldValue",this.value);
    },
    onChangeMonthYear: function(year, month, dpInst, tpInst) {
        this.value = $(this).data("oldValue");
    },
    onClose: function() {
        this.value = $(this).data("oldValue");
    }
}).keyup(function() {
    $(this).data("oldValue",this.value);
});

工作示例。不漂亮，但可以完成工作......一些边缘情况：

  • 当您浏览弹出窗口时，一切正常，但如果您尝试编辑文本字段，它会返回到当前月份（虽然不是真正的问题）。
  • 如果您使用鼠标将一些日期粘贴到文本字段中，然后立即单击“下一个”或“上一个”，它将不会保持正确的值（虽然不知道一个简单的跨浏览器解决方案）。
  • 如果您更改月份然后选择时间，日期也将更改为当前月份，正如@streetlight 所指出的那样。为防止这种情况，controlType可能会使用自定义，但完整的实现超出了此答案的范围。

更新：正如@streetlight 指出的另一个问题——使用“现在”按钮后，一切似乎都变得“有问题”（有时它使用旧值，有时是新值）——我得出的结论是，工作量太大了在用户代码中执行。假设实际上在导航日历时不自动更改值对可用性更好，我建议与 jQuery 团队一起打开 RFE 以提出此选项。

于 2012-11-27T17:16:02.753 回答