jQuery的手机redirect或更改url时，网页没有任何CSS
我正在与骨干，jQuery的移动，快递应用程序。 一切正常，当应用程序启动和正常工作，但是，当我点击一个链接或更改url的HTML呈现正确，但没有jQuery的移动魔术出现。 它只在页面和页脚和格式的login部分呈现，但是当URL改变，我回来了，页面失去了CSS或jQuery的移动魔术。
define(['views/index', 'views/register', 'views/login', 'views/forgotpassword', 'views/profile', 'views/vinbookDoc', 'models/Account', 'models/Vinbook', 'models/vinBooksCollection'], function(IndexView, RegisterView, LoginView, ForgotPasswordView, ProfileView, vinbookDocView, Account, Vinbook, vinBooksCollection) { var AppRouter = Backbone.Router.extend({ currentView: null, routes: { "index": "index", "login": "login", "desk/:id": "desk", "profile/:id": "profile", "register": "register", "forgotpassword": "forgotpassword", "vinbook/:id": "showVinbook" }, initialize: function(){ $('.back').live('click', function(event) { window.history.back(); return false; }); this.firstPage = true; }, showVinbook: function(id) { var getCollection = new vinBooksCollection(); getCollection.url = '/accounts/me/vinbook'; this.changeView( new vinbookDocView({ collection: getCollection, id: id })); getCollection.fetch(); }, changeView: function(page) { this.currentView = page; $(this.currentView.el).attr('data-role', 'page'); this.currentView.render(); $('body').append($(this.currentView.el)); var transition = $.mobile.defaultPageTransition; // We don't want to slide the first page if (this.firstPage) { transition = 'none'; this.firstPage = false; } $.mobile.changePage($(this.currentView.el), {changeHash:false, transition: transition}); }, index: function() { this.changeView(new IndexView() ); }, desk: function (id){ var model = new Account({id:id}); this.changeView(new ProfileView({model:model})); model.fetch({ error: function(response){ console.log ('error'+JSON.stringify(response)); } }); console.log('works'); }, profile: function (id){ this.changeView(new IndexView() ); }, login: function() { this.changeView(new LoginView()); }, forgotpassword: function() { this.changeView(new ForgotPasswordView()); }, register: function() { this.changeView(new RegisterView()); } }); return new AppRouter(); }); 要求
require.config({ paths: { jQuery: '/js/libs/jquery', jQueryUIL: '/js/libs/jqueryUI', jQueryMobile: '/js/libs/jqueryMobile', Underscore: '/js/libs/underscore', Backbone: '/js/libs/backbone', models: 'models', text: '/js/libs/text', templates: '../templates', jqm: '/js/jqm-config', AppView: '/js/AppView' }, shim: { 'jQueryMobile': ['jQuery', 'jqm' ], 'jQueryUIL': ['jQuery'], 'Backbone': ['Underscore', 'jQuery', 'jQueryMobile', 'jQueryUIL'], 'AppView': ['Backbone'] } }); require(['AppView' ], function(AppView) { AppView.initialize(); });
login
define(['AppView','text!templates/login.html'], function(AppView, loginTemplate) { window.loginView = AppView.extend({ requireLogin: false, el: $('#content'), events: { "submit form": "login" }, initialize: function (){ $.get('/login', {}, function(data){}); }, login: function() { $.post('/login', { email: $('input[name=email]').val(), password: $('input[name=password]').val() }, function(data) { console.log(data); if (!data.error){window.location.replace('#desk/me');} }).error(function(){ $("#error").text('Unable to login.'); $("#error").slideDown(); }); return false; }, render: function() { this.$el.html(loginTemplate); $("#error").hide(); return this; } }); return loginView; });
只是更多的细节：
当我从页面或url更改为另一个页面时，呈现的网站将出现一个闪光，然后CSS或devise消失。
我认为这可以解决你的问题：
$(document).bind('pagechange', function() { $('.ui-page-active .ui-listview').listview('refresh'); $('.ui-page-active :jqmData(role=content)').trigger('create'); });