JavaScript库由于变量未定义而失败，但它只在页面加载的一半时发生

我有一个JavaScript项目来构建一个模式窗口，在其中显示项目任务。在模态窗口中有几个JS库，用于诸如弹出窗口、就地编辑、日期选择器、标记、@提及、滚动条等等

这个项目现在一团糟，但这是我的第一个大JS项目，进展顺利

基本上会有任务列表，当单击任务时，它会加载任务数据并将任务库初始化到模式窗口中

所有任务在DOM中共享相同的模式，因此当模式关闭时，它会销毁启动的库并重置数据。单击的下一个任务记录将重做模式的构建周期

我最近还通过添加

#任务模式=1414135033731

到URL。其中数字将是任务记录数据库ID号

我的问题是，大约50%的时候，当我加载页面时，所有的加载都是完美的，没有控制台错误，所有的工作都很好

其他50%的负载因控制台错误而停止：

Uncaught TypeError: Cannot read property 'offsetWidth' of undefined  
In file jquery-datepicker-foxrunsoftware.js:440

我使用的日期选择器日历库文件的第440行显示了以下代码

下面代码中的第440行是

var width=tbl.offsetWidth

  /**
   * Internal method which lays out the calendar widget
   */
  layout = function(el) {
    var options = $(el).data('datepicker');
    var cal = $('#' + options.id);
    if (options.extraHeight === false) {
      var divs = $(el).find('div');
      options.extraHeight = divs.get(0).offsetHeight + divs.get(1).offsetHeight;  // heights from top/bottom borders
      options.extraWidth = divs.get(2).offsetWidth + divs.get(3).offsetWidth;     // widths from left/right borders
    }
    var tbl = cal.find('table:first').get(0);
    var width = tbl.offsetWidth;                 // line 440 
    var height = tbl.offsetHeight;
    cal.css({
      width: width + options.extraWidth + 'px',
      height: height + options.extraHeight + 'px'
    }).find('div.datepickerContainer').css({
      width: width + 'px',
      height: height + 'px'
    });
  },



单击时，控制台错误将显示以下内容



如前所述，它有一半的时间会发生，其他时间工作正常，没有显示此错误

我的应用程序乱七八糟，有很多行代码可以在这里发布，但我已经上传了一个演示，在这里展示了它的实际应用

演示：已删除

查看演示时，请查看控制台。它可能会全部加载find，但随后继续重新加载页面，最终会出现错误。有时我会一次又一次地犯错误

我真的卡住了，我需要帮助克服这个问题

我不想使用一个新的日期选择器库，但在这一点上，如果我不能摆脱这个错误，我可能不得不这样做


如果可以的话，请帮助我。我已经在这件事上被困了好几个星期了

由于某些原因，您的日期选择器尚未初始化，并且您的
'#'+options.id
查找失败，因此即使有尝试的想法也会很感激

有一些东西是异步的，你不用等它了（或者datepicker只是一个蹩脚的插件，谢天谢地，我不太喜欢jQuery）。
在错误列表中，其中一个会让我使用AJAX编写代码来加载数据和差异。也许我需要尝试在那个区域初始化我的datepicker库。令我感到奇怪的是，它有时是随机工作的，有时是不随机工作的。当我单击打开模式时，我从DOM中的任务列表中为任务加载数据。当我从URL中的散列加载模态时，它会发出AJAX请求，所以似乎只有在使用AJAX加载时才会发生这种情况。所以这是一个进步，我会接受的。这不是一个解决方案，但我认为问题已经确定，我将对此加以考虑。谢谢