jQuery 日期选择器：setDate 不是函数

Question

我目前正在尝试使内联日期选择器对象与日期输入交互，并且已经管理了除一件事以外的所有事情。当我尝试使用输入的更改事件时，它会抛出一个错误：

Uncaught TypeError: $.start_widget.setDate is not a function

我的Django template/jQuery代码如下，包含在一个脚本标签中，插入到文档的头部：

$(document).ready(function(){

  {% for string in datepickerstrings %}
    jQuery.{{ string }}_widget = $('#datepicker-{{ string }}');

    $.{{ string }}_widget.datepicker({
      inline: true,
      altField: '#event-{{ string }}',
      onSelect: function (date, instance) {
        $('#event-{{ string }}').val(date);
      }
    });
    $.{{ string }}_widget.hide();

    $('#event-{{ string }}').focusin(function () {
        $.{{ string }}_widget.show();
    });

    $('#{{ string }}-close').on("click", function (e) {
        e.preventDefault();
        $.{{ string }}_widget.hide();
    });

    $('#event-{{ string }}').change(function () {
        console.log("Changed date value from field: " + $(this).val());
        $.{{ string }}_widget.setDate($(this).val());
    });
  {% endfor %}

});

然后在像这样发送给客户端之前进行处理（仅限相关循环）：

$(document).ready(function(){


    jQuery.start_widget = $('#datepicker-start');

    $.start_widget.datepicker({
      inline: true,
      altField: '#event-start',
      onSelect: function (date, instance) {
        $('#event-start').val(date);
      }
    });
    $.start_widget.hide();

    $('#event-start').focusin(function () {
        $.start_widget.show();
    });

    $('#start-close').on("click", function (e) {
        e.preventDefault();
        $.start_widget.hide();
    });

    $('#event-start').change(function () {
        console.log("Changed date value from field: " + $(this).val());
        $.start_widget.setDate($(this).val());
    });

});

对我来说，这看起来像 $.start_widget-object 在 change 事件处理程序之前明确定义和初始化，但它抛出上述异常。 console.log 调用显示正确的日期。

我也尝试用这个替换 setDate 调用：

$.start_widget.datepicker( "setDate", $(this).val() );

但是，我得到了相同的结果。几个小时以来，我一直在努力解决这个问题，但似乎无法自行解决。我的代码有什么问题？

编辑 1：根据 ImBack 的建议，我得到了这个错误：

Uncaught TypeError: date.getDate is not a function
    _setDate @ ui.datepicker.js:1077
    _setDateDatepicker @ ui.datepicker.js:243
    (anonymous function) @ ui.datepicker.js:1426
    each @ jquery-1.8.3.min.js:2
    each @ jquery-1.8.3.min.js:2
    $.fn.datepicker @ ui.datepicker.js:1424
    (anonymous function) @ (index):66
    dispatch @ jquery-1.8.3.min.js:2
    u @ jquery-1.8.3.min.js:2

Answer 1

尝试以下操作：

$(document).ready(function () {
    var start_widget = $('#datepicker-start').datepicker({
        inline: true,
        altField: '#event-start',
        onSelect: function (date, instance) {
            $('#event-start').val(date);
        }
    });
    start_widget.hide();

    $('#event-start').focusin(function () {
        start_widget.show();
    });

    $('#start-close').on("click", function (e) {
        e.preventDefault();
        start_widget.hide();
    });

    $('#event-start').change(function () {
        console.log("Changed date value from field: " + $(this).val());
        start_widget.datepicker("setDate", $(this).val());
    });
});

我将你的 widget 存储在一个变量中，然后以正确的方式调用 setDate。

Answer 2

我自己解决了这个问题。显然，唯一需要做的就是将 $(this).val() 变成 new Date($(this).val())，因为库无法自行将字符串解析为 Date。这让我相信我有一个非标准版本的插件，因为文档清楚地说明：

setDate( date )

Sets the date for the datepicker. The new date may be a Date object or a string in the current date format (e.g., "01/26/2009"), a number of days from today (e.g., +7) or a string of values and periods ("y" for years, "m" for months, "w" for weeks, "d" for days, e.g., "+1m +7d"), or null to clear the selected date.

jQuery 日期选择器：setDate 不是函数

jQuery Datepicker: setDate is not a function

jquery

datepicker

django-templates

jquery-ui-datepicker

typeerror

setDate( date )