Question

我正在使用Trent Richardson为jQuery UI的datepicker设置的优秀Datetimepicker插件。

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

例如，您可以查看示例页面here（使用下拉列表而不是滑块）。

这是我的初始化代码：

$('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 here。

Answer 1

您可以在每个keyup和select之后保存之前的值，并在changeMonthYear或close期间将其恢复：

$( ".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);
});

工作example。不漂亮，但完成工作......一些边缘情况：

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

更新，因为@streetlight指出了另一个问题 - 在使用“Now”按钮后，一切似乎都变得“毛病”（有时它会使用旧值，有时新的） - 我得出结论这是用户代码中的太多工作。假设实际上在导航日历时不能自动更改值的可用性更好，我建议使用jQuery团队打开RFE以提出此选项。

已禁用自动日期值在jQuery DateTimePicker中的下一个/上一个操作期间更改

1 个答案: