JQuery Mobile DateBox - 超过1个实例

时间:2011-05-22 19:22:41

标签: javascript jquery jquery-mobile

我正在使用JQuery Mobile Datebox,因为我遇到了以下问题。

我有第A页和第B页。

如果我转到第B页并打开名为“date2”的日期选择器,请将其关闭,然后单击主页链接,该链接将转到第A页。

现在,我在页面a,然后按下按钮打开日期选择器A,称为“日期”......

问题在于我正在打开......这就像他们都打开了一样。

如何关闭日期选择器的实例?

以下是第A页的相关代码:

头脑中:

<script type="text/javascript">
        $( document ).bind( "mobileinit", function(){
            $.mobile.page.prototype.options.degradeInputs.date = 'text';
        }); 
    </script>

然后是表格/日期选择器1:

<form action="#" method="POST">
        <div data-role="fieldcontain" style="visibility:hidden;">
          <input value="" name="date" type="date" data-role="datebox" id="date" data-theme="a" data-options='{"mode": "calbox", "pickPageTheme": "a", "pickPageHighButtonTheme": "e", "setDateButtonLabel": "Calendar", "useDialogForceTrue": false, "useDialogForceFalse": true }'/>   


          </div>
          </form>

现在是第B页的相关代码

页面中的

<script type="text/javascript">
        $( document ).bind( "mobileinit", function(){
            $.mobile.page.prototype.options.degradeInputs.date = 'text';
        }); 
    </script>

<script language="javascript">
    $(document).ready(function() {

       var queryDate = $.url.param("mydate");
       $('#date2').val(queryDate);


    });

</script>

表单部分:

<form action="save.php" method="POST">

          <label for="date2" style="margin:10px 0px;">Event Date:</label>
          <input value="1/1/2011" name="date2" type="date" data-role="datebox" id="date2" data-theme="a" data-options='{"pickPageTheme": "a", "pickPageHighButtonTheme": "e", "setDateButtonLabel": "Add Date", "dateFormat": "dd/mm/YYYY"}'/>  

          <label for="textarea">Add:</label>
                <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
                <input type="submit" value="Save" data-theme="a" />


          </form>

有人有任何线索吗?

由于

1 个答案:

答案 0 :(得分:2)

如果你正在使用jquery mobile,请不要将document.ready()用于jqm。不起作用。使用这样的东西。 查看jqm演示以获取完整的事件列表。 Demo

 $(document).live('pageshow',function() {

       var queryDate = $.url.param("mydate");
       $('#date2').val(queryDate);


    });

此外,所有js都应该在加载的第一个html中。在你的情况下它是页面A. 只是因为后续页面是通过ajax加载的,并且内部写入的js将不会被执行。