JQuery Mobile DateBox - более 1 экземпляра

Question

Я использую JQuery Mobile Datebox, поскольку у меня возникла следующая проблема.

У меня есть страница A и страница B.

Если я перехожу на страницу B и открываю средство выбора даты «date2», затем закрываю его и нажимаю ссылку «Домашняя страница», которая переходит на страницу A.

Теперь я нахожусь на странице a и нажимаю кнопку, чтобы открыть средство выбора даты A, называемое "date" ...

Проблема в том, что у меня оба открываются ... как будто они оба открыты или что-то в этом роде.

Как можно убить экземпляр средства выбора даты после закрытия, пожалуйста?

Вот соответствующий код для страницы 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>

У кого-нибудь есть какие-нибудь подсказки, пожалуйста?

Спасибо

Answer 1

Если вы используете jquery mobile, не используйте document.ready () для jqm.она не будет работать.используйте что-то подобное вместо этого.проверьте демо jqm для полного списка событий. Демо

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

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


    });

Также все js должны быть в первом загруженном html.в вашем случае это страница A. Просто потому, что следующая страница загружается через ajax и js, которая написана внутри, не будет выполнена.