jQuery Mobile:如何将插件与通过 Ajax 获取的 div 绑定

Question

我正在尝试将DatePicker插件添加到JQM应用程序中。 当HTML代码在我的应用程序中是静态的时，一切正常，但是当我通过Ajax拉取HTML时，插件停止初始化（我检查了，所有插件文件都加载到浏览器，控制台中没有错误，只是什么也没发生）。

我确定发生这种情况是因为插件期望一个 HTML 标签保留（在这种情况下为"输入"），该标签在加载时不存在 - 当 Ajax 从服务器文件中获取它时，它会显示，这需要一秒钟。

代码很简单。

插件（由 Ajax 拉入 HTML 文件）：

<input type="text" data-field="datetime" readonly>
<div id="dateBox"></div> // space for plugin's calendar

插件初始化：

$(document).on('pageshow', '#page-id-where-input-is-appended', function() {           
  $("#dateBox").DateTimePicker(); 
});

我想解决这个问题意味着在初始化时使用适当的 JQM 方法。我使用了pageshow，以及一些在页面DOM准备就绪后工作的不同方法 - 从pageinit到pagechange。现在成功了。

有什么提示吗？

Answer 1

试试

<input type="text" data-field="datetime" id="calendar_box" readonly>
<div id="dateBox"></div>
$(document).on('pageshow', '#page-id-where-input-is-appended', function() {           
  $("#calendar_box").DateTimePicker(); 
});