jquery - 无法将 MobiPick 日期选择器集成到已经具有 data-role="page" 的 div 的自定义表单中

Question

我对 Javascript 和 jQuery 非常陌生，但想将下面漂亮的日期选择器集成到我们的表单中。

http://mobipick.sustainablepace.net/demo-advanced.html

故障码：

$(document).on( "pagecreate", "#demo", function() {
var picker = $( "input[type='text']", this );
picker.mobipick();
});



<div id="demo" data-role="page" data-add-back-btn="true">
<div data-role="content" >
<div class="demo">
<input type="text" />
</div>
</div>
</div>

问题是它只在 pagecreate 上运行函数并传递我不知道实际传递的“this”。我的表单已经有一个主表单<div data-role="page">，当我添加另一个 div 时<div id="demo" data-role="page">，第二个 div 不显示。如果我将其更改为<div id="demo" data-role="subpage">then 它会显示，但上面的功能不会触发。

Answer 1

其他人发布了这个完美运行的代码。

Javascript

          $(document).ready(function () {
            var picker = $("#StartDate", this);
            picker.mobipick();
            picker.bind("change", function () {
                var date = $(this).val();
            // formatted date                   
            var dateObject = $(this).mobipick("option", "date");
            });
            });

html

<input name="StartDate" id="StartDate"  type="text" value=""/>