Jquery Mobile DateBox plugin only working when linked directly to page

问题

I am using the DateBox ( http://dev.jtsage.com/jQM-DateBox/ ) plugin for a page with the latest build of JqueryMobile but am finding an odd bug. When I open my app on index.html and navigate through the pages to the page with the date picker is I get this - http://cl.ly/19022K40472e3k0D0D2H

However if I go direct to the page via the address bar it works fine and shows up as it should.

So just wondering is anyone else having problems with this? Or any idea how to fix it?

Also I might add does anyone know how I can have the current date show in the text field?

Thanks.

回答1:

1) Looks like it is a problem with the css of datebox not being loaded properly.Are you loading the CSS of datebox in index.html?.In that case,when you directly go to the page with the datepicker,CSS might not be loaded.You can check if datebox css is loaded by using firebug for firefox or the in built developer tool in Chrome/Safari.(Check the resources tab to see all the loaded resources)

2)Check this example - http://jsfiddle.net/BNsPB/. In this example I wrote the code in document ready,in your case you might have to write it in pageinit or pagecreate event handlers

After checking your actual code I think you have to add the above code snippet in the pageshow event handler like this:(Assuming bookingPage is the id of the page)

$("#bookingPage").live( 'pageshow',function(event, ui){
  var today = new Date();
    var todayStr = today.getFullYear()+"-"+(today.getMonth()+1)+"-"+today.getDate();
    $('#mydate').trigger('datebox', {'method':'set', 'value':todayStr});
     });
});

回答2:

You need to load the files in the actual file that your site navigates to in the first instance (index.html presumably). It sounds like you have only referenced the CSS and plugin code in your date picker page, but in default mode jQM uses an ajax hash-based navigation system, so you need to reference assets in such a way that they are available right from the get-go.

来源：https://stackoverflow.com/questions/7708839/jquery-mobile-datebox-plugin-only-working-when-linked-directly-to-page

标签

jquery-mobile

datebox