javascript - JQuery datepicker 仅在我在脚本中放置 alert() 时才有效

Question

我正在用一些输入字段(在每一行)编写一个 jQuery 数据表。其中一个字段需要是日期，因此我尝试使用 jQuery datepicker 来完成该字段的输入。

使用模板为每一行呈现有问题的字段:

var invoiceDateInputTemplate = '<input class="datepicker" id="InvoiceDate_{0}" name="InvoiceDate_{0}" type="text" />';

在数据表构建期间，我呈现模板并将 {0} 替换为适当的 ID，以便每行的 ID 和名称参数都是唯一的。

在 $(document).ready() 函数的末尾，在构建表之后，我运行以下代码，使用类选择选项将我的每个“日期”字段设置为启用日期选择器的字段。出于某种原因，这似乎不想导致字段启用日期选择器:

$(function() {
    $(".datepicker").datepicker();
});

如果我在 $(".datepicker").datepicker() 之前添加一个 alert() 调用，它会像冠军一样工作...在 datepicker 初始化之后的 alert() 调用不起作用。

这会导致 DatePicker 呈现:

$(function() {
    alert();
    $(".datepicker").datepicker();
});

这会导致 DatePicker 不呈现(包括在内以提供示例):

$(function() {
    $(".datepicker").datepicker();
    alert();
});

为什么会这样？我是否遗漏了导致 DatePicker 无法按预期初始化字段的内容？我很确定必须发出警报才能让 DatePicker 正常工作不是标准操作程序。另外，澄清一下，我认为在数据表构建之后我没有关注任何字段。

Answer 1

我感觉你遇到了异步问题!

最简单的解决方案是在自定义事件上绑定(bind)对datepicker() 的调用，然后在构建数据表后触发该事件。像这样:

$(function() {
    // Create data table here
    $(window).trigger('datatable.built');
});

$(window).on('datatable.built', function() {
    $(".datepicker").datepicker();
});