jQuery Datepicker：setDate不是一个函数

Question

我目前正在尝试使内联datepicker对象与日期输入进行交互，并且除了一件事之外已经管理了一切。当我尝试使用输入的变化时，它抛出一个错误：

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

我的Django的模板/ 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明确定义一个nd在更改事件处理程序之前初始化，但它会抛出上述异常。呼叫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

我自己想出了这个问题。显然，唯一需要的是将$(this).val()转换为new Date($(this).val())，因为库无法将字符串自身解析为日期。这使我相信，我有因为插件的非标准版本，如何文档明确规定：

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.

Answer 2

尝试以下操作：

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