只有在脚本中放入alert()时，JQuery datepicker才能工作

JQuery datepicker only works if I put an alert() in the script

本文关键字：JQuery datepicker 工作 脚本 alert      更新时间：2023-09-26

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

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

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

在数据表构建期间，我呈现模板并将{0}替换为适当的Id，因此Id &每一行的名称参数是唯一的。

在$(document).ready()函数的末尾，在构建表之后，我运行以下代码，使用类选择选项将每个'date'字段转换为启用日期拾取器的字段。由于某种原因，这似乎不希望导致字段启用日期拾取器:

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

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

这会导致DatePicker呈现:

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

这会导致DatePicker不呈现(包括提供一个示例):

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

为什么会发生这种情况?我是否错过了一些会导致DatePicker没有按预期初始化字段的东西?我很确定，必须触发一个警报才能让DatePicker正确工作，这不是标准的操作程序。另外，为了澄清，我不认为在数据表构建之后我有任何字段被关注。

我感觉你有一个异步问题!

最简单的解决方案是在自定义事件上绑定对datepicker()的调用，然后在构建数据表后触发该事件。像这样:
$(function() {
    // Create data table here
    $(window).trigger('datatable.built');
});
$(window).on('datatable.built', function() {
    $(".datepicker").datepicker();
});

你在datatable中使用了什么?最有可能的是在你附加事件之后它才会呈现，在这种情况下它应该有一个像draw这样的事件来表示数据被呈现

试着用这个:

$(function() {
    $(document).on("focusin",".datepicker",function(){
        $(this).datepicker();
    });
});

如果它工作，您可以改进不"重新创建"日期选择器每次元素获得焦点

事实证明，@Guy有解决方案…我在setTimeout中设置了这个函数，它开始正常工作:

setTimeout(function() {
        $(".datepicker").datepicker();
    },1000);
我应该早点想到这一点的。谢谢@Guy !
相关文章：